webpack核心概念

一，模式mode

1，开发模式，development包管理工具的--dev指令，是指包安装在改位子。2,生产模式，production

二，出入口

入口：所有资源的被打包的入口文件出口：控制所有入口文件打包后的位子

三，loader

四，Plugin

五，打包部署路径问题，

1，webpack虽然支持amd和cmd模块化，但是使用的时候还是要注意一般业务代码是使用amd，而对于webpack的配置等编写采用cmd。

1)对于webpack配置的使用就要注意了，语法是基于node的，所以在路径的使用就需要特别注意./ / ../的区别。

/表示部署在服务器的根路径上。./表示部署在服务器的当前文件下的路径。

①案列：前端history路由模式下的使用webapck的dll提取公共库问题。

由于history路由模式下，服务端是配置了404转发到index.html，按F5刷新的时候，会由index.html重新加载静态资源。该插件add-asset-html-webpack-plugin可动态引入script脚本，上述配置该插件会会在html中生成上述配置下该插件会在html中生成这个两种情况下的script标签在history路由模下，当浏览器按下F5刷新时候。/vendor/vendor.dll.js加载资源是在服务器根路径（完整路径就是服务器的根路径+/vendor/vendor.dll.js）下找。而./vendor/vendor.dll.js则是会在服务器当前路径（该当前路径可以说是指服务器的根路径加上前端路由，完整路径就是服务器的根路径加上前端路由+/vendor/vendor.dll.js）找不到资源

②原理：

如果浏览器输入的是example.com/some/path，那么按F5刷新后webpack的runtime会认为它位于example.com/some/path。那么webpack加载vendor.dll.js时会变成example.com/some/path/vendor/vendor.dll.js这样的路径；然而vendor.dll.js的真正路径是在example.com/vendor/vendor.dll.js，https://blog.csdn.net/weixin_...