认识webpack

At it’s core, webpack is a static module bundle for modern JavaScript application.
能够将代码转换成大部分浏览器能识别的代码，能处理模块之间的依赖
CSS，img，json文件都可以被webpack当做模块来使用
更加强调模块化开发管理

webpack的安装

依赖node环境，用npm安装

webpack的起步

webpack ./src/main.js ./dist/bundle.js

webpack的配置

根目录下创建文件webpack.config.js

const path = require('path')
module.exports = {
  entry: './src/main.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '',
  },
}

path不能用相对路径
需要动态获取路径，先npm init

loader的使用

如果需要加载CSS，图片，vue文件转js，webpack本身不支持。
需要使用对应的loader，

安装

rules: [
      {
        test: /\.css$/,
        use: [
          { loader: "style-loader" },
          { loader: "css-loader" }
        ]

require

webpack中配置Vue

plugin的使用

搭建本地服务器