webpack配置

概念 链接https://doc.webpack-china.org/configuration/

webpack 是一个现代的 JavaScript 应用程序的模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图表(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成少量的 bundle - 通常只有一个，由浏览器加载。

它是高度可配置的，但是，在开始前你需要先理解四个核心概念：入口(entry)、输出(output)、loader、插件(plugins)。一个一个来解释

entry(入口)

指的是你需要打包的文件

我这里的需要打包的文件就是main.js.,我们这里只是单个文件的写法，要是想多个文件打包呢？该怎么写

我们可以写成数组的方式，那么问题又来了，如果我们想把不同的的入口文件单独打包到不同的路径下，比如吧css与js分开，那又该怎么写呢？我们来看看官网上怎么说的。

上面这句英语我拿有道翻译了一下，大概得意思就是：如果传递一个对象:创建多个条目包。关键是块名称。值可以是字符串或数组。

output

output可以通过传入的id或者name值得不同，打包成不同的文件。

　　path:导出目录为绝对路径（必选项）。就是说，打包好了，文件放在哪里。

　　filename:仅用于命名每个文件。

　　publicPath:指定在浏览器中引用的输出文件的公共URL地址,对于嵌入<script>或< link >标记或像图像这样的引用资产的加载器，当它与磁盘上的位置不同

　　　　　　　　(如路径所指定的)时，publicPath被用作href或url()。

loader

loader 用于对模块的源代码进行转换,

devServer

devServer: {
  contentBase: path.join(__dirname, "dist"),//告诉服务器从哪里提供内容。
  compress: true,//一切服务都启用gaip压缩 true
  port: 9000 //端口号
}

　　启用项目时，服务器的一些配置，不是很懂，所以就不写详细了，随便提一下，跨域也是在devServer里面设置的。前段时间群里有个小伙伴在使用axios不能跨域，也是配置devServer里的proxyTable实现的。

express跨域写法，做个笔记

app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By",' 3.2.1')
    res.header("Content-Type", "application/json;charset=utf-8");
    next();
});