html-webpack-plugin插件根据模板生成多页面

1、项目目录结构为：

2、webpack.config.js配置文件为：

var htmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {//打包入口
    entry: {main: './src/js/main.js',a: './src/js/a.js',b: './src/js/b.js',c: './src/js/c.js'},//打包后的文件
    output: {//不加__dirname 会报错path: __dirname + '/dist',//注意：使用[name]确保每个文件名都不重复filename: 'js/[name]-[chunkhash].js',//线上地址配置publicPath:'http://cdn.com/'},plugins: [new htmlWebpackPlugin({template: 'index.html',filename: 'a.html',title: 'this is a.html',//增加指定的chunkschunks:['main','a']}),new htmlWebpackPlugin({template: 'index.html',filename: 'b.html',title: 'this is b.html',//增加指定的chunkschunks:['main','b']}),new htmlWebpackPlugin({template: 'index.html',filename: 'c.html',title: 'this is c.html',//增加指定的chunkschunks:['main','c']})]
}

3、执行命令：

npm run webpack

4.编译：

html-webpack-plugin插件根据模板生成多页面相关推荐

Java读取根据HTML模板生成HTML页面
首先,我们需要一个html模板: <html> <head> <title>###title###</title> <meta http-equi ...
java web根据excel word模板生成前台页面，自动求和
</pre>项目要求根据excel制作前台,并得出结果,开始的时候想用table套嵌input接收数据,后台运算,或者jqurey计算,数了一下excel表,如果那样的话80多个字段,而且 ...
织梦模板生成html页面,织梦模板系统tag标签静态化生成静态HTML页面的教程
DEDECMS是个强大的CMS系统,虽然自带的TAG标签是动态的,但是可以设置伪静态,但是现在我们不满足于伪静态,想生成完全的静态化文件,其实完全是可以生成网站所有TAG列表的静态网页文件,还可以生成 ...
织梦模板生成html页面,织梦模板制作html常用标签
随着计算机网络的迅速发展,利用Internet上的网站.和精美的网页来吸引浏览者的目光,不再是一个孤立的问题,它成为了大家共同关注的目标.<html>课程涉及到的内容有网页架设.网页编辑. ...
Java项目生成静态页面
文章由本人原创,如需转载,请注明转载出处!本文地址: http://blog.csdn.net/xxd851116/archive/2009/06/24/4293239.aspx 第一次做项目需要生成 ...
php简单的静态页面现成,PHP生成静态页面的简单方法
页面静态化的方法,分为两种,一种是伪静态,就是url 重写,一种是你真的静态化.下面介绍PHP中页面静态化的方法. 什么是PHP静态化 PHP静态化的简单理解就是使网站生成页面以静态HTML的形式展现 ...
从零开始的webpack生活-0x003：html模板生成
0x001 概述上一章之后已经可以自动刷新浏览器了,大大方便了我们的开发,这章开始讲插件,第一个插件将会解决上一章节的一个问题,那就是index.html需要手动插入打包好的js,同时不会将inde ...
Webpack之插件html webpack plugin
Webpack之插件html webpack plugin html-webpack-plugin插件动态生成html文件并自动引入js文件静态文件无需加载js或css文件,通过设置入口文件可以将 ...
Sonarqube plugin插件在使用Sonar-scanner时不能扫描 file index 动态新生成的文件解决方案
Sonarqube plugin插件在使用Sonar-scanner时不能扫描 file index 动态新生成的文件解决方案参考文章: (1)Sonarqube plugin插件在使用So ...

html-webpack-plugin插件根据模板生成多页面

html-webpack-plugin插件根据模板生成多页面相关推荐

最新文章

热门文章

html-webpack-plugin插件 根据模板生成多页面

html-webpack-plugin插件 根据模板生成多页面相关推荐

最新文章

热门文章

html-webpack-plugin插件根据模板生成多页面

html-webpack-plugin插件根据模板生成多页面相关推荐