liangxinwei_roadhog
基于作者 sorrycc 的 roadhog 的 1.3.* 的扩展,仅适用于我们自己的项目
安装
$ npm i liangxinwei_roadhog --save-dev
使用
同 roadhog
配置文件如下:
我们项目中用到了 @antv/data-set、moment 等一些大的 js 库,所以把它们都配置到 externals,将 @antv/data-set、moment 配置到 root/public/js 下,如果有引入顺序的需求,请给文件名设置数字前缀。
在项目的 index.ejs 下引入 css 和 js 文件:
<% var stylesheets = htmlWebpackPlugin.options.stylesheets || [] %> <% for(var i = 0; i < stylesheets.length; i++) { %> <% } %> <% var scripts = htmlWebpackPlugin.options.scripts || [] %> <% for(var i = 0; i < scripts.length; i++) { %> <% } %>
roadhog 作者约定 public 目录下的文件会在 server 和 build 时被自动 copy 到输出目录(默认是 ./dist)下,所以可以在这里存放 favicon, iconfont, html, html 里引用的图片等。htmlWebpackPlugin.options.stylesheets 和 htmlWebpackPlugin.options.scripts 是 roadhog 约定的 root/public/ 下存放 js 和 css 的文件夹下所有后缀名为 js 和 css 的文件列表,会自动挂载到 htmlWebpackPlugin 下,直接在 index.ejs 引入就行。
例如:
├── public 静态资源目录,会直接复制到 dist 目录下,使用时需要绝对路径引入
| ├── js js 文件
| | |── 0_moment.min.js
| | └── 1_data-set.min.js
| ├── stylesheets css 文件
| | └── test.css
LICENSE
MIT