目录

.babelrc

Rollup+Vue+TS

scripts/rollup.config.js

package.json

---

可以同时使用多个 Plugin 和 Preset，此时，它们的执行顺序非常重要。

先执行完所有 Plugin，再执行 Preset。 多个 Plugin，按照声明次序顺序执行。 多个 Preset，按照声明次序逆序执行。 比如 .babelrc配置如下，那么执行的顺序为：

1. Plugin：transform-react-jsx、transform-async-to-generator
2. Preset：es2016、es2015

.babelrc

{"plugins": [ "transform-react-jsx","transform-async-to-generator"],"presets": [ "es2015","es2016"    ]
}

Rollup+Vue+TS

scripts/rollup.config.js

import path from 'path'
// rollup-plugin-typescript2版本多增加了校验，更好用一些
// npm install typescript -D
// npm install rollup-plugin-typescript2
import typescript from 'rollup-plugin-typescript2'
// babel
// npm install @rollup/plugin-babel
import babel from '@rollup/plugin-babel'
// npm install rollup-plugin-vue -D
import vue from 'rollup-plugin-vue'
export default [{// 入口文件input: path.resolve(__dirname, "../src/main.tsx"),// 打包后信息配置output: {file: "build/main.js",format: 'commonjs',name: 'main'},// 配置插件plugins: [vue(),//报sfc单文件组件报错 vue插件 rollup-plugin-vuetypescript(),babel({// 处理vue ts jsxexclude: "node_modules/**", // 排除// 编译报错：不是js的文件，加下面这个处理extensions: [".js", ".jsx", ".tsx", ".ts"],// 让babel处理这些类型文件presets: ["@babel/preset-env","@babel/preset-typescript"],plugins: ["@vue/babel-plugin-jsx"]})]
}]

package.json

"scripts": {"test": "echo \"Error: no test specified\" && exit 1","build": "webpack --config scripts/webpack.config.js","serve": "webpack serve --config scripts/webpack.config.js","buildrollup": "rollup -c --config script/rollup.config.js"},