标签：等等 javascrip 引入 dex plugin inject html 变量 ext
1.怎么解决每次打包后的文件名都要记住再可使用的问题
1.1首先要用到webpack的一个插件：nmp install html-webpack-plugin --save-dev
1.2在webpack-config.js里引入对插件的引用
2.怎么将输出的文件，输出到不同的目录下
2.1首先改变path路径
2.2其次改变filename路径 （详情见webpack.config.js）
3.传递参数
3.1首先在plugins里配置参数（详情见webpack.config.js里的plugins的title(title为个人定义 的变量，如果想传多个参数可以定义title1 title2等等)）
3.2调用参数,在html的标签里
<title><%= htmlWebpackPlugin.options.title%></title>
4.遍历htmlWebpackPlugin对象里的值（不用于项目，只为学习）
<%for(var key in htmlWebpackPlugin.files){%>
<%=key%> :<%=JSON.stringify(htmlWebpackPlugin.files[key])%>
<%}%>
<%for(var key in htmlWebpackPlugin.options){%>
<%=key%> :<%=JSON.stringify(htmlWebpackPlugin.options[key])%>
<%}%>
5. 想要将打包生成后的js文件的引入一部分放在head里，一部分放在body里。这时我们只能手动的写js代码来改变，配置是达不到的
5.1首先在自己建的index.html的head标签里写如下代码将main生成的打包js引用放在head里
<script type="text/javascript" src="<%=htmlWebpackPlugin.files.chunks.main.entry%>"></script>
5.2在body里将 a生成的打包js应用放在body里
<script type=‘text/javascript‘ src=‘<%=htmlWebpackPlugin.files.chunks.a.entry%>‘></script>
5.3此时需要把webpack.config.js里的inject改为false，不然它会自动的将文件引入到head
6.打包后上线
publicpath: //上线时，引用的打包后的绝对路径的地址将会变成publicpath对应的值
7.对打包文件压缩
minify
8.多页面应用，只需要在plugins里，继续new就可以（详情见webpack.config.js）,如果想要做到生成的html引用不同的文件，只需要在chunks里配置即可，但是此时需要把5中的js代码删除
9.如果界面非常多，此时我们去一一的给界面指定使用的js会很麻烦，此时我们就要用excludeChunks它表示哪些js文件被排除在外
10.直接将初始化的界面以内嵌的方式引入界面，在自己的引入模版（index.html）里写如下代码（head里写，将main.js以内嵌的方式引入）
<script type="text/javascript">
<%=compilation.assets[htmlWebpackPlugin.files.chunks.main.entry.substr(htmlWebpackPlugin.files.publicPath.length)].source()%>
</script>
11.公共方法的外连接引入文件的方式
<%for(var k in htmlWebpackPlugin.files.chunks){%>
<%if(k!==‘main‘){%>
<script type="text/javascript" src="<%=htmlWebpackPlugin.files.chunks[k].entry%>"></script>
<%}%>
<%}%>
标签：等等 javascrip 引入 dex plugin inject html 变量 ext
原文地址：http://www.cnblogs.com/cxdxm/p/6616612.html
