webpack构建的index.html根据环境动态修改加载的static下静态文件路径

1,566 阅读1分钟

起因:项目部署的路径类似http://localhost:8080/daping 多一级文件路径(公司子项目、主域名是指向公司主项目的)在index.html里面加载static(不会被webpack打包)文件夹下的js、img等静态资源

开发环境加载资源路径:http://localhost:8080/static/js/xxx.js

非开发环境加载资源路径:http://localhost:8080/daping/static/js/xxx.js

对比两个路径可见多了一级/daping

网上找资料说可以通过HtmlWebpackPlugin的方式解决 blog.csdn.net/chi1217/art…

自己的实现方式通过DefinePlugin在webpack.base.conf.js

    new webpack.DefinePlugin({
        'projectPath': JSON.stringify(process.env.NODE_ENV === 'production'?'/daping':'')
    }),

html文件

 <!--js文件引入-->
  <script src="<%= projectPath %>/static/js/jquery-1.12.4.min.js"></script>