1

ブロッコリーにlivereloadを追加しようとしています

残念ながら、live-reload プラグインのドキュメントは少し短く、動作させることができません。ドキュメントには、次のことを行うように記載されています。

var injectLivereload = require('broccoli-inject-livereload');

var public = injectLivereload('public');

Brocfile.jsこれは(右?)の中に配置する必要があると考えました。しかし、何をしても何もリロードされません (更新するにはリロードを押す必要があります) 'public'。ディレクトリを表していると思われる部分も変更しました。どんな助けでも大歓迎です。

4

2 に答える 2

2

Livereload の代わりに、Broccoli Browser Sync プラグイン経由で Browsersync を使用することにしました

私の最終的Brocfile.jsなものは(プラグインnpmページから引き出された)に非常に似ていました:

var fastBrowserify = require('broccoli-fast-browserify');
var babelify = require('babelify');
var mergeTrees = require('broccoli-merge-trees');
var compileSass = require('broccoli-sass-source-maps');
var funnel = require('broccoli-funnel');
var BrowserSync = require('broccoli-browser-sync');

var optionalTransforms = [
  'regenerator'
  // 'minification.deadCodeElimination', 
  // 'minification.inlineExpressions' 
];

var babelOptions = {stage: 0, optional: optionalTransforms, compact: true};

// var browserifyOpts = {deps: true, entries: files, noParse: noParse, ignoreMissing: true}; 
var transformedBabelify = fastBrowserify('app', {
  browserify: {
    extensions: [".js"]
  },
  bundles: {
    'js/app.js': {
      entryPoints: ['app.js'],
      transform: {
        tr: babelify,
        options: {
          stage: 0
        }
      }
    }
  }
});

var appCss = compileSass(['piggy/frontend/app'], 'main.scss', 'css/app.css');

var staticFiles = funnel('frontend', {
  srcDir: 'static'
});

var browserSync = new BrowserSync([staticFiles, transformedBabelify, appCss]);

module.exports = mergeTrees([staticFiles, transformedBabelify, appCss, browserSync]);

このソリューションにより、ブロッコリーを使用してアセットを提供し続けることができbroccoli serve、すべてのアセットが再構築され、css を含むブラウザーにリロードされました。

于 2016-07-22T18:40:33.097 に答える