最近開發的時候發現要寫html的模板還要寫模板對應的css、還要寫模板的js。這些東西加起來很多，要佔用很多地方。放在頁面上佔地方，也不一定會每次都用到。分成幾個檔案還要分心去管理。

如果使用vue的方式吧，整個專案也不能這麼輕易的換成別的框架。既然這樣，不如我來處理掉他們吧。

處理方式

1.安裝gulp，配置任務自動處理對應的檔案。這麼有一個gulp配置的demo，直接複製改配置就可以自動處理這些任務。github地址
2.下載gulp-mad，這個外掛將傳入的檔案處理成一個整個的js，同時可以支援typescript等其他格式的檔案轉換。gulp-mad地址
3.配置任務，將需要處理的檔案監控起來。
4.啟動gulp。
5.小提示：可以將vue的格式化外掛用在這個js頁面上，效果棒棒的。

const gulp = require('gulp');
const mad = require('gulp-mad');
const ts = require('gulp-typescript');

gulp.task("default", function () {
    gulp.src("expmlate/a.mad")
        .pipe(mad(".ts"))
        .pipe(ts({ module: "amd" }))
        .pipe(gulp.dest('dist'));
});