Сегодня утром быстро понял, что gulp.watch настроен на просмотр ./scripts/app.js, а не на все файлы JS — ./scripts/*.js. Эта проблема была быстро решена путем обновления файла config.js…
javascript : { module : './scripts/app.js', src : './scripts/*.js', dest : './build/scripts/', file : 'bundle.js' },
…и затем обновление…
return browserify({entries: config.javascript.src, debug: true})
…to…
return browserify({entries: config.javascript.module, debug: true})
Продолжение просмотра…
Я сильно пострадал, разбив на модули приложение размером 100 КБ. Причина в том, что мне вручную (потому что я не знаю, как иначе) приходится создавать десятки дополнительных экспортов и требуется разрешить совместное использование функций и переменных между файлами. Бывший:
// main.js var animateResizing = false; exports.animateResizing = animateResizing; // manage-toolbar.js module.exports = manageToolbarToggle; // alt-inspector.js var manageToolbarToggle = require('./manage-toolbar'); var animateResizing = require('./main').animateResizing; ...and the list goes on forever...and ever
Либо я что-то не так делаю, либо это норма. Хотелось бы, чтобы был способ получить все переменные из другого модуля.
Хотя это может привести к конфликтам, поэтому конкретизация, т. е. создание экспорта, может принести пользу. Нам придется подождать и посмотреть.
Это такой медленный процесс…
Возможно, мне нужно найти решение…
Во-первых, очистить неиспользуемые модули.
npm uninstall gulp-babel --save-dev
Вот мой текущий файл package.json.
{ "name": "viewer", "version": "1.1.0", "private": true, "engines": { "node": ">=4.2.1" }, "devDependencies": { "babel-preset-es2015": "^6.6.0", "babelify": "^7.2.0", "browser-sync": "^2.11.0", "browserify": "^13.0.0", "gulp": "^3.9.0", "gulp-autoprefixer": "^3.1.0", "gulp-file-include": "^0.13.7", "gulp-newer": "^1.1.0", "gulp-plumber": "^1.1.0", "gulp-sass": "^2.1.0", "gulp-sourcemaps": "^1.6.0", "mkdirp": "^0.5.1", "request": "^2.67.0", "require-dir": "^0.3.0", "vinyl-buffer": "^1.0.0", "vinyl-source-stream": "^1.1.0", "vinyl-transform": "^1.0.0" } }
Я не помню, чтобы устанавливал Vinyl-Transform, но пока оставлю его там.
Смотреть
Теперь, чтобы ускорить его с помощью watchify.
npm install watchify --save-dev
Через четыре дня…
На собственном горьком опыте обнаружил, что Watchify мне не нужен, так как Gulp.watch() уже выполняет свою работу.
npm uninstall watchify --save-dev
Мне просто нужно было переработать tasks/javascripts.js.
Это не идеально. Мне придется вернуться и просмотреть его после того, как я разобью на модули небольшой и более срочный проект.
Аяксифай
Я провел пятницу и понедельник (вчера), пытаясь разбить на модули небольшой проект. Почему так сложно? Ррррр! В любом случае, сегодня утром я решил проблему. Посмотреть выпуск можно на Github.
Вот и все на сегодня!
Несколько случайных плагинов и статей
- Объяснение процесса сборки Faster Gulp, Browserify, Babelify, Watchify и React.
- Улучшение работы плагина jQuery с помощью инструментов npm
- Глоток-длительность
Отказ от ответственности. Дневник разработчиков пишется каждый день, и предыдущие статьи не обновляются. Код может работать сегодня, но завтра будут найдены глюки. Проявите должную осмотрительность и тщательно протестируйте любой написанный здесь код, прежде чем внедрять его в свой собственный проект. Удачи!