vue2 源码热更新启动

1. 安装启动服务和更新插件

执行 npm i --save-dev rollup-plugin-browsersync

www.browsersync.cn/docs/option… rollup-plugin-browsersync api文档

2. 在文件位置 scripts/config.js 添加以下代码

const browsersync = require('rollup-plugin-browsersync')

3. 在 scripts/config.js 搜索 web-full-dev 并添加以下代码

'web-full-dev': {
  entry: resolve('web/entry-runtime-with-compiler.js'),
  dest: resolve('dist/vue.js'),
  format: 'umd',
  env: 'development',
  alias: {he: './entity-decoder'},
  banner,
  // 新增
  plugins: [
    browsersync(
      {
        // 默认路径 ./
        server: '',    
        // 需要被监听的文件。 ./ 为监听全部
        files: ['./examples','./scripts','./src','./index.html'],  
        // 是否自动打开浏览器
        open: true
      }
    )
  ]
},

4. './index.html' 文件位置

5. html 文件引入vue.js

如果访问的是 ./index.html 使用 <script src="dist/vue.js"></script>

如果访问的是 examples 文件夹下的内容，把vue.min.js 改为 vue.js

script 要引入的是下面图片框选的 dist/vue.js 文件

6. 执行

npm run dev

成功运行，可以打开浏览器热更新调试vue源码啦！！！

提示：http://localhost:3000 访问的是 server: '' 设置的路径，如果要访问 examples 文件夹下的内容需要在后面加上文件路径。如：http://localhost:3000/examples/tree/