'basic config rollup.js for Vue.js SFC file

I just try to config a rollup configuration for bundler little project that use VueJS.

I follow steps configuration and I use Rollup-Plugin-Vue.

But Rollup seems to be not recognize first specific tag vue ("") in file

It tell this error :

src/renderer/renderer.js → build...
(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
vue (imported by src\renderer\renderer.js)
@/service/router (imported by src\renderer\renderer.js)
[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
src\renderer\App.vue (1:0)
1: <template>

I try to play with external, autoExternals, TypeScript enabled/disabled but nothing...

This is my config rollup file :

import typescript   from '@rollup/plugin-typescript'
import vue          from 'rollup-plugin-vue'
import autoExternal from 'rollup-plugin-auto-external'
import path         from 'path'

export default [
{
    input: 'src/main/main.js',
    output:
    {
        dir: "build",
        format: 'cjs'
    }
},
{
    input: 'src/renderer/renderer.js',
    output:
    {
        dir: "build",
        format: 'cjs',
        plugins: [
            vue({ css: true, compileTemplate: true }),
            typescript(),
            autoExternal({
                builtins: false,
                dependencies: true,
                packagePath: path.resolve('./packages/module/package.json'),
                peerDependencies: false,
            }),
        ]
    },
    // external:['@vue']
}]

What did I forget for rollup to understand my vueJS SFC file?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source