一.使用場景：
1.node創建的前台項目需要輸入地址展示頁面
2.有設置緩存或者cdn的需要在靜態文件更改時能使用新的而不是緩存的，需要版本號這里
3.可能需要壓縮靜態文件的
二.一些參考地址，需要安裝的插件
1.loader ( https://github.com/JacksonTian/loader )（配合編譯使用的）
2.loader-builder( https://github.com/JacksonTian/loader-builder )( 打包的）
3.完整的筆記地址，是x-mind的需要先安裝如果要看的話（https://github.com/13476075014/node-vue/blob/master/mynodeproject/11.oldcode/各種筆記/x-mind%20筆記/node/loader.xmind）
需要先全局安裝: npm install loader-builder -g
然后本地項目安裝loader: npm install loader
三.使用步驟
1..在package.json里面加上一個打包的指令 loader,后面運行項目需要先運行這個指令打包后再啟動項目
具體內容如下：
//在scripts下面加上loader的指令
.......
"scripts": {
"start": "set NODE_ENV=production && nodemon --inspect main.js",
"dev": "set NODE_ENV=development && nodemon --inspect main.js",
"makes": "mingw32-make",
"loader":"loader ./static/views/mobile ./" //這個指令，用loader-builder來打包我的mobile下面的view的ejs模板的文件 打包后在根目錄生成一個assets.json的指向文件和和生成對應的js和css壓縮打包的文件在指定的目錄下
},
....
2.在啟動js里面加上loader和assetsMap的引用的掛在在全局變量上，我的是main,js上
具體代碼如下：
// main.js
......
const Loader = require('loader') ；
.....
app.locals.Loader = Loader // 插件loader
app.locals.assetsMap = require('./assets.json') //運行指令后的指向文件
3.根據開發環境和生產環境來區分是否需要展示原靜態文件還是壓縮后的文件，生產環境展示壓縮的
在main.js里面把參數掛在全局，后面頁面使用loader的時候根據這個值是否是true來決定是否使用壓縮文件，具體代碼如下
//main.js
let mydev = process.env.NODE_ENV.trim()
app.locals.myDebug = (mydev && mydev=='production') ? true : false //在loader中根據環境來決定是否要用壓縮的靜態文件
4.在某個引用了js和css的ejs頁面使用loader
具體代碼如下：
// index.ejs <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"> ....... // css的引用 myDebug是掛在node的全局渲染變量，這里決定是否使用壓縮后的文件，cdn的配置見loader的github上的介紹
<%- Loader("/static/public/mobile/min/index.min.css")
.css("/static/public/mobile/css/orderDetails.css")
.css("/static/public/mobile/css/index.css")
.done(assetsMap，'',myDebug) %>
....... //js的引用 <%- Loader("/static/public/mobile/min/apiUrlConfig.min.js") .js("/static/public/mobile/js/apiUrlConfig.js") .done(assetsMap，'',myDebug) %>
......
5.因為打包后的地址設置的static....這里要把這個地址設置成可訪問的靜態文件
在main.js中根據自己設置的打包后的地址來配置，具體代碼如下（我的是用的/static/public/mobile/min/。。。這個地址，所以這里設置static的時候路由是這個文件夾）
app.use('/static', express.static(path.join(__dirname+'/static')));
6.執行命令打包和啟動 ：
npm run loader
（會生成assets.json里面的內容，和生成對應的js和css在指定的目錄下）
7.到這里就可以直接啟動項目了，可以設置開發環境和生產環境