標籤：try index 源檔案 ack doc 文檔 ports back span
html模板
<!doctype html><html><head> <meta charset="UTF-8"> <!-- 寫入title --> <title><%= htmlWebpackPlugin.options.title %></title> <!-- 寫入公用JS --> <script> <%= compilation.assets[htmlWebpackPlugin.files.chunks.main.entry].source() %> </script></head><body> <!-- 非公用JS寫入 --> <% for (var k in htmlWebpackPlugin.files.chunks) { %> <% if(k !== ‘main‘) { %> <script src="<%= htmlWebpackPlugin.files.chunks[k].entry %>"></script> <% }%> <% } %></body></html>
<%= coding %>這個為 htmlWebpackPlugin 官方支援的範本語言
JS模板
var htmlWebpackPlugin = require(‘html-webpack-plugin‘);const path = require(‘path‘);module.exports = { entry: { a: ‘./src/js/a.js‘, b: ‘./src/js/b.js‘, main: ‘./src/js/main.js‘ }, output: { path: path.resolve(__dirname, ‘dist‘), filename: ‘js/[name].bundle.js‘ }, plugins: [ new htmlWebpackPlugin({ title: "我就是標題1", //HTML文檔的標題。 filename: "a.html", // 產生的模板檔案的名字 template: "index.html", //模板來源檔案 inject: false, //不注入，在html模板寫入 chunks: [‘main‘,‘a‘] //引入的模組 }), new htmlWebpackPlugin({ title: "我就是標題2", filename: "b.html", template: "index.html", inject: false, chunks: [‘main‘,‘b‘] }) ]};
多頁面時，只要new htmlWebpackPlugin() 就可以。
html-webpack-plugin參數詳解
webpack html-webpack-plugin外掛程式寫入行內模式
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
