rollup安装配置

rollup介绍

rollup官网：https://www.rollupjs.com/guide/zh

rollup是一个 JavaScript 模块打包器，可以将小块代码编译成大块复杂的代码，例如 library 或应用程序。rollup对代码模块使用新的标准化格式，这些标准都包含在 JavaScript 的 ES6 版本中，而不是以前的特殊解决方案，如 CommonJS 和 AMD。它可以帮助你从一个入口文件开始，将所有使用到的模块文件都打包到一个最终的发布文件中。它能优化冗余代码，体积更小，适用于类库，vue和react都是通过rollup打包的。

rollup安装配置

1. 安装rollup和babel插件：npm install --save-dev rollup rollup-plugin-babel babel-plugin-external-helpers rollup-plugin-node-resolve

2. 安装babel：npm install --save-dev babel-core babel-preset-env

3. 根目录创建.babelrc文件，并对预设(presets) 和 插件(plugins) 进行配置：

   {
"presets": [
["latest", {
"es2015": {
"modules": false
}
}]
],
"plugins": ["external-helpers"]
}

4. 根目录创建rollup.config.js并配置，内容参考如下：

   import babel from 'rollup-plugin-babel'
import resolve from 'rollup-plugin-node-resolve'

   export default{
input: "src/index.js",
output: {
file: "build/bundle.js",
format: "umd"
},
plugins: [
resolve(),
babel({
exclude: 'node_modules/**'
})
]
}

5. 配置package.json中的scripts

   "scripts": { "start": "rollup -c rollup.config.js" },

6. 运行 npm start

成功后你就可以在./build/bundle.js中看到打包完成的代码

最后

以上就是小巧月亮为你收集整理的rollup安装配置的全部内容，希望文章能够帮你解决rollup安装配置所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。