webpack+vue构建打包assetsPublicPath 动态化的问题

在使用vue-cli创建webpack配置文件之后有个assetsPublicPath参数是用来配置最后生产环境静态资源所在的根目录，一般来说生产和开发过程中静态文件的根目录都是一样的，不过也有的时候是不一样的，比如用cdn部署静态文件，这个时候需要做assetsPublicPath配置动态化。

有些小伙伴会采用生产环境和开发环境分别打包的技术，不过这样要维护两份静态资源，也不是很好

其实vue-cli 创建的webpack配置文件其中的assetsPublicPath参数只不过是封装了webpack的publicPath 参数，

而publicPath参数在webpack的官方文档中是怎么说的呢？

https://webpack.js.org/configuration/output/

In cases where the publicPath of output files can't be known at compile time, it can be left blank and set dynamically at runtime in the entry file using the free variable __webpack_public_path__.

 __webpack_public_path__ = myRuntimePublicPath// rest of your application entry

See this discussion for more information on __webpack_public_path__.

当你在打包过程中并不确定最后静态资源存放目录的时候可以不设置publicPath参数这个时候webpack会使用一个自由变量__webpack_public_path__来作为静态资源目录

不知道是不是理解上的问题 文档里把__webpack_public_path__ 

称之为自由变量，但是按照实际的行为来说__webpack_public_path__ 与JavaScript中free variable的行为完全不一样

实际上 __webpack_public_path__ 的生命周期只存在于webpack打包阶段

打包之后__webpack_public_path__ 并不会被挂载到window作用域下而会被当做一个模块处理，最后他的值等于在项目js文件中对自由变量__webpack_public_path__的赋值的表达式（注意是‘表达式’而不是‘值’）

所以我个人喜欢将其称之为‘宏变量’