vue饿了么学习-第二篇（webpack）

1.在这个项目中，webpack的入口，在package.json下，scripts内容中的dev上，

也就是命令：cnpm run dev这个命令，

在scripts中的所有命令（dev,bulid,test,lint…）都是我们在运行项目的时候常用的，cnpm run (xxx).

2.当执行cnpm run dev的时候，实则是去执行dev：node bulid/dev-server.js文件，也就是项目中，bulid目录下的dev-server.js文件。

3.在任何页面中，引入组件，可以不用写.VUE后缀，因为在config中已经做了处理。

4.在webpack.base.conf.js中，可以看到整个项目的入口文件，输入文件，优化文件。

module.exports = {
  entry: {
    app: './src/main.js'
  },
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath: process.env.NODE_ENV === 'production'
      ? config.build.assetsPublicPath
      : config.dev.assetsPublicPath
  },
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
    },
    symlinks: false
  },

5.在webpack.dev.conf.js中，主要是对项目进行hot reload进行处理，也就是实现某些改变数据后，无刷新更换；对比base文件和变换data，进行合并处理。

module.exports = merge(baseWebpackConfig, {
  module: {
    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
  },
  // cheap-module-eval-source-map is faster for development
  devtool: '#cheap-module-eval-source-map',
  plugins: […]
})

6.（……）