Successfully integrate babel
Failed to integrate babel
$ git clone https://coding.net/u/hilojack/p/my-rollup-issue/git vue2
$ cd vue2
$ npm i
$ rollup -c -w
[!] (babel plugin) SyntaxError: /Users/hilojack/www/egg/vue2/src/App.vue: Unexpected token (1:0)
src/App.vue (1:0)
SyntaxError: /Users/hilojack/www/egg/vue2/src/App.vue: Unexpected token (1:0)
> 1 | <template>
| ^
2 | <div class="container">
rollup.config.js
import json from "rollup-plugin-json";
import resolve from "rollup-plugin-node-resolve";
import commonjs from "rollup-plugin-commonjs";
import babel from "rollup-plugin-babel";
import VuePlugin from "rollup-plugin-vue";
import replace from 'rollup-plugin-replace';
import uglify from 'rollup-plugin-uglify';
//import postcss from 'rollup-plugin-postcss';
export default{
//input: "src/main.js",
input: ["src/index.js"],
output: {
format: "esm",
name: "myBundle",
dir: "dist",
//file: "dist/bundle.js",
paths: {
vue: "https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.esm.browser.js",
}
},
experimentalCodeSplitting: true,
external: ["lodash", "vue"],
watch: {
//exclude: ['node_modules/**', 'dist/**',], //default ignore
include: ['src/**','src/App.vue'],
},
plugins:[
babel({ exclude: 'node_modules/**' }),
json(),
//resolve({ jsnext: true, main: true, browser: true, }),
resolve({ browser: true, }),
commonjs(),
VuePlugin(),
replace({
exclude: 'node_modules/**',
ENV: JSON.stringify(process.env.NODE_ENV || 'development'),
}),
(process.env.NODE_ENV === 'production' && uglify()),
],
};
Plugin order matters here, putting VuePlugin() at the start of the list would help.
Add babel({ exclude: 'node_modules/**', include: '**/*.js' }).
Most helpful comment
Plugin order matters here, putting
VuePlugin()at the start of the list would help.