easywebpack-multiple-html-boilerplate

HTML 静态多页面 Webpack 构建工程化解决方案骨架

Usage no npm install needed!

<script type="module">
  import easywebpackMultipleHtmlBoilerplate from 'https://cdn.skypack.dev/easywebpack-multiple-html-boilerplate';
</script>

README

easywebpack-multiple-html-boilerplate

HTML静态多页面Webpack构建工程化解决方案骨架

特性

  • 支持 HTML 静态多页面构建
  • 支持 nunjucks 模板静态多页面构建
  • 支持 Webpack 构建自动刷新功能
  • 支持 babel, es6, postcss, eslint等特性
  • 支持 css, sass, less, styus
  • 支持构建结果UI展示
  • 支持独立HTML模板和全局HTML模版
  • 支持 easywebpack-cli 创建项目和构建

更多特性请见 基于 Webpack 的前端构建工程化解决方案

版本

  • easywebpack-html ^4.x.x > webpack 4.x.x
  • easywebpack-html ^2.x.x > webpack 3.x.x

安装

npm install
npm install easywebpack-cli -g

运行

npm start 

// or
easy start

// or
node build

编译

npm run build

// or
easy build prod 

// or
node build

HTML模板

  • 独立模板, Entry目录下面包含同名的HTML页面
  • 全局模板(entry.template), 没有独立模板时,将采用全局模板.

HTML构建时, 首先取独立模板,如果文件存在,则使用独立模板, 否则取全局模板.

nunjucks

nunjucks loader 默认是禁用, 你可以通过如下方式开启:

// webpack.config.js
module.exports = {
  loaders: {
    nunjucks: {
      options: {
        searchPaths: ['./widget', './test']  // nunjucks 模板查找目录
      }
    }
  },
}

HTTP Proxy

use koa-proxy plugin proxy http request:

// webpack.config.js
module.exports = {
  proxy: {
    host:  'http://localhost:8888',   
    match: /\/debug/
  },
}