Мой browserify рабочий процесс (от кофе JS, с browserify-shim
и coffeeify
), как это:Laravel 5 продлить эликсир включить browserify
У меня есть 2 основных файлов, app.coffee
и _app.coffee
, соответственно для интерфейса и серверной. Оба файла находятся в resources/coffee/front
и resources/coffee/back
(соответственно). Я пытаюсь включить задачу browserify
в laravel elixir, поэтому файл результатов будет на public/js/app.js
и public/js/_app.js
и может быть изменен в папку build
позже.
До сих пор я пытался расширить эликсир, создав файл browserify.js
в папке node_modules elixir ingredients
. Содержание:
var gulp = require('gulp');
var browserify = require('browserify');
var watchify = require('watchify');
var source = require('vinyl-source-stream');
var logger = require('../../../gulp/util/bundleLogger');
var errors = require('../../../gulp/util/handleErrors');
var config = require('../../../gulp/config').browserify;
elixir.extend('browserify', function(callback) {
var bundleQueue = config.bundleConfigs.length;
var browserifyThis = function(bundleConfig) {
var bundler = browserify({
cache: {},
packageCache: {},
fullPaths: true,
entries: bundleConfig.entries,
extensions: config.extensions,
debug: config.debug
});
var bundle = function() {
logger.start(bundleConfig.outputName);
return bundler
.bundle()
.on('error', errors)
.pipe(source(bundleConfig.outputName))
.pipe(gulp.dest(bundleConfig.dest))
.on('end', finished);
}
if (global.isWatching) {
bundler = watchify(bundler);
bundler.on('update', bundle);
}
var finished = function() {
logger.end(bundleConfig.outputName);
if (bundleQueue) {
bundleQueue--;
if (bundleQueue === 0) {
callback();
}
}
}
return bundle();
};
config.bundleConfigs.forEach(browserifyThis);
});
Config для browserify является:
browserify: {
debug: true,
extensions: ['.coffee'],
watch: './resources/assets/coffee/{front,back}/**/*.coffee',
bundleConfigs: [
{
entries: './resources/assets/coffee/front/app.coffee',
dest: './public/js',
outputName: 'app.js'
},
{
entries: './resources/assets/coffee/back/app.coffee',
dest: './public/js',
outputName: '_app.js'
}]
}
Тогда в моем глотке задаче эликсира, я делаю это:
var gulp = require('gulp');
var elixir = require('laravel-elixir');
gulp.task('elixir', function() {
return elixir(function(mix) {
mix.sass('app.scss').browserify().version(['.public/css/app.css', './public/js/app.js', '.public/js/_app.js']);
});
});
Это не работает, потому что функция callback
является не входит в эликсир (первоначально это глоток). Даже если это так, часы elixir не будут слушать мои оригинальные файлы .coffee
(я пытаюсь посмотреть весь файл кофе, расположенный в resources/coffee/**/*.coffee
).
Так что я подумал, как решение является повторно запустить всю процедуру эликсира, если файл изменен, как:
gulp.task('default', function() {
runSequence('coffeelint', 'browserify', 'elixir', 'images', 'watch');
});
и моей watch
задачи:
gulp.task('watch', function() {
gulp.watch(config.browserify.watch, ['coffeelint', 'default']);
gulp.watch(config.images.src, ['images']);
});
Но ошибка заключается в том, что он говорит, что функция sass() в elixir не может быть связана с браузером(). есть идеи как это сделать?