lx-pages
一款輕量級基于Gulp的構建工具
快速實現(xiàn)將開發(fā)階段中代碼自動轉(zhuǎn)換為生產(chǎn)環(huán)境代碼
支持轉(zhuǎn)換less/sass
支持壓縮html、js飞几、css
支持swag模版轉(zhuǎn)換
支持開發(fā)階段開啟本地服務器調(diào)試和熱更新
1. Installation
$ npm install lx-pages --save-dev
# or yarn
$ yarn add lx-pages --dev
2. 在項目根目錄創(chuàng)建pages-config.js
demo項目目錄如下：
Snip20210820_5.png
pages-config.js中需要配置的文件路徑：
module.exports = {
//默認配置
build : {
src : 'src', //項目根路徑
dist : 'dist', //輸出路徑
temp : '.temp', //臨時路徑,可不做修改
public : 'public', //靜態(tài)資源砚哆，打包后復制在dist目錄
paths : { //src下的各個文件存放路徑-結(jié)合自己項目修改
styles : 'css/**',
scripts : 'js/*.js',
pages : '*.html',
images : 'images/*.{jpg,jpeg,png,gif,svg}',
fonts : 'fonts/**'
}
}
}
3. 在package.json中配置scripts
"scripts": {
"build": "lx-pages build",
"serve": "lx-pages serve"
},
4. 開發(fā)階段運行
npm run serve
生產(chǎn)階段運行
npm run build
5. 注意點
html中引入的less或者sass文件，需要改成css結(jié)尾屑墨，避免build后找不到樣式文件躁锁。
<!--<link rel="stylesheet/less" href="css/index.less">-->
<link rel="stylesheet" href="css/index.css">
github
https://github.com/XuanLee/lx-pages
gitee
https://gitee.com/li-XuAn-lx/lx-pages
npm
https://www.npmjs.com/package/lx-pages
