Javascript 西兰花js和browserSyn构建
我尝试使用BrocoliJS、babel和browserSync定制构建管道。 到目前为止,工作如预期;我可以使用ES6脚本,我的文件会被监视:保存文件后,它会自动构建并刷新页面。现在我知道了Javascript 西兰花js和browserSyn构建,javascript,browser-sync,broccolijs,Javascript,Browser Sync,Broccolijs,我尝试使用BrocoliJS、babel和browserSync定制构建管道。 到目前为止,工作如预期;我可以使用ES6脚本,我的文件会被监视:保存文件后,它会自动构建并刷新页面。现在我知道了 broccoli build dist 用于生成连接的可分发版本 我想知道是否可以清理dist文件夹,并在那里构建连接版本 此时,server.js文件如下所示: var broccoli = require("broccoli"); var brocware = require("broccoli/l
broccoli build dist
用于生成连接的可分发版本
我想知道是否可以清理dist文件夹,并在那里构建连接版本
此时,server.js文件如下所示:
var broccoli = require("broccoli");
var brocware = require("broccoli/lib/middleware");
var mergeTrees = require("broccoli-merge-trees");
var Watcher = require("broccoli-sane-watcher");
var browserSync = require("browser-sync");
const funnel = require('broccoli-funnel');
const concat = require('broccoli-concat');
const esTranspiler = require('broccoli-babel-transpiler');
const pkg = require('./package.json');
const src = 'src';
const indexHtml = funnel(src, {
files: ['index.html']
});
const js = esTranspiler(src, {
stage: 0,
moduleIds: true,
modules: 'amd',
// Transforms /index.js files to use their containing directory name
getModuleId: function (name) {
name = pkg.name + '/' + name;
return name.replace(/\/index$/, '');
},
// Fix relative imports inside /index's
resolveModuleSource: function (source, filename) {
var match = filename.match(/(.+)\/index\.\S+$/i);
// is this an import inside an /index file?
if (match) {
var path = match[1];
return source
.replace(/^\.\//, path + '/')
.replace(/^\.\.\//, '');
} else {
return source;
}
}
});
const main = concat(js, {
inputFiles: [
'**/*.js'
],
outputFile: '/' + pkg.name + '.js'
});
// http://stackoverflow.com/questions/32190327/add-livereload-to-broccolis
var tree = mergeTrees([main, indexHtml]); // your public directory
var builder = new broccoli.Builder(tree);
var watcher = new Watcher(builder);
watcher.on("change", function(results) {
if (!results.filePath) return;
// Enable CSS live inject
if (results.filePath.indexOf("css") > -1) {
return browserSync.reload("*.css");
}
browserSync.reload();
});
browserSync({
server: {
baseDir: "./",
middleware: brocware(watcher)
}
});