Question

我想在webpack旁边使用浏览器同步。我的配置如下：

var ExtractTextPlugin = require('extract-text-webpack-plugin');
var BrowserSyncPlugin = require('browser-sync-webpack-plugin');
var WebpackNotifierPlugin = require('webpack-notifier');
var precss = require('precss');
var autoprefixer = require('autoprefixer');
var path = require('path');

var sassLoaders = [
  'css-loader',
  'postcss-loader',
  'sass-loader?includePaths[]=' + path.resolve(__dirname, './sass')
];

module.exports = {
  entry: './babel/index.js',
  output: {
    path: 'js',
    filename: 'index.js'
  },
  sassLoader: {
    includePaths: path.resolve(__dirname, './sass')
  },
  externals: {
    'TweenLite': 'TweenLite'
  },
  plugins: [
    new WebpackNotifierPlugin({
      title: 'Webpack',
      alwaysNotify: true
    }),
    new ExtractTextPlugin('../css/style.css'),
    new BrowserSyncPlugin({
      host: 'localhost',
      port: 3000,
      browsers: [],
      server: { baseDir: [ './' ] }
    })
  ],
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel',
        query: {
          presets: ['es2015']
        }
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('style-loader', sassLoaders.join('!'))
      }
    ]
  },
  postcss: function() {
    return [
      precss,
      autoprefixer({ browsers: ['last 2 versions'] })
    ];
  }
};

我使用browser-sync-webpack-plugin安装（使用npm）browser-sync。但是当我运行webpack -w时，我正在

ReferenceError: Plugin is not defined
    at Object.<anonymous> ((...)/node_modules/browser-sync-webpack-plugin/index.js:21:1)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)
    at require (internal/module.js:16:19)
    at Object.<anonymous> ((...)/webpack.config.js:2:25)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)

我该怎么办？

Answer 1

看来这个问题与browser-sync-webpack-plugin的版本有关。它似乎在1.0.3中得到修复。

Webpack和browsersync - 插件未定义

1 个答案: