第十节: rollup打包

项目初始化

npm init -y

rollup安装

npm i @babel/preset-env@7.15.0 @babel/core@7.15.0 npm i rollup@2.56.0 rollup-plugin-babel@4.4.0 rollup-plugin-serve@1.1.0 -D npm install --global rollup

• babel: es6 -> es5
• rollup-plugin-babel -> rollup 和 babel产生关联

配置rollup

• rollup.config.js

import babel from 'rollup-plugin-babel';
import serve from 'rollup-plugin-serve';

export default  {
  input: './src/index.js',//打包的入口文件
  output: {
    file: 'dist/vue.js',
    format: 'umd',//打包方式 在window上 Vue
    name: "Vue",
    sourcemap: true
  },
  plugins: [
    babel({
      exclude: 'node_modules/**',//排除文件
    }),
    
    serve({
      port: 3000,
      contentBase: '',//路径基准 当前目录
      openPage: '/index.html'
    })
  ]
}

• .babelrc: 解析配置babel

{
  "presets": [
    "@babel/preset-env"
  ]
}

• 配置启动命令

"scripts": {
  "dev": "rollup -c -w"
},
// -c 表示执行配置文件
// -w 监控代码