配置文件

entry

入口

// 单入口
entry:'xxx/xxx/entry.js'

// 多入口
entry:{             
    app:'xxxx.js',
    main:'xxx.js'
}

externals

通过 externals 可以告诉webpack 在运行环境中已经内置了哪些对象，不用打包这些对象。常用于一些不需要打包即可使用的对象，如jquery、loadsh

// wepback.config.js
module.exports={
    externals:{
        // 将导入语句用到的所有 jquery 替换成运行环境的全局变量 JQuery
        jquery:'JQuery'
    }
}

dev-server

简单来说，webpack-dev-server就是一个小型的静态文件服务器。

安装：npm i -D webpack-dev-server

使用：

// webpack.config.js
const webpack = require('webpack')
module.exports={
    devServer:{
        contentBase:路径  //设置要监听的路径
        hot:true        //启动 HMR 模块热刷新
    },
    plugins:[
        new webpack.NameModulesPlugin().
        new webpack.HotModuleReplacementPlugin() //加载 HMR 模块
    ]
}