2016-11-08 27 views
1

由於某些原因,我無法讓webpack在變更時重建我的文件。我基本上遵循了Browsersync - Webpack + TypeScript RecipeWebpack不能在變更時重建

webpack.config.js

let path = require('path'); 
let webpack = require('webpack'); 

let config = { 
    debug: true, 
    devtool: 'eval', 
    entry: './app/index.ts', 
    output: { 
    publicPath: '/', 
    path: path.join(__dirname, 'wwwroot'), 
    filename: 'bundle.js' 
    }, 
    plugins: [], 
    resolve: { 
    extensions: ['', '.ts', '.js'] 
    }, 
    module: { 
    loaders: [ 
     { test: /\.ts$/, loader: 'ts', include: path.join(__dirname, 'app') } 
    ] 
    } 
}; 
module.exports = config; 

我的瀏覽器同步配置(server.js),我從字面上配方複製:

var browserSync   = require('browser-sync').create(); 
var webpack    = require('webpack'); 
var webpackDevMiddleware = require('webpack-dev-middleware'); 
var stripAnsi   = require('strip-ansi'); 
var webpackConfig = require('./webpack.config'); 
var bundler  = webpack(webpackConfig); 

bundler.plugin('done', function (stats) { 
    if (stats.hasErrors() || stats.hasWarnings()) { 
     return browserSync.sockets.emit('fullscreen:message', { 
      title: "Webpack Error:", 
      body: stripAnsi(stats.toString()), 
      timeout: 100000 
     }); 
    } 
    browserSync.reload(); 
}); 

browserSync.init({ 
    server: 'wwwroot', 
    open: false, 
    logFileChanges: false, 
    middleware: [ 
     webpackDevMiddleware(bundler, { 
      publicPath: webpackConfig.output.publicPath, 
      stats: {colors: true} 
     }) 
    ], 
    plugins: ['bs-fullscreen-message'], 
    files: [ 
    ] 
}); 

,並啓動了一切,我只是使用NPM腳本部分:

"scripts": { 
    "build": "node server" 
}, 

每當我在01中更改打印稿文件沒有任何反應。 我在這裏做錯了什麼?

回答

2

通過明確地將watch部分添加到webpack dev中間件配置來修復它。

如這裏要求的是配置變化:

browserSync.init({ 
    ... 
    middleware: [ 
    webpackDevMiddleware(bundler, { 
     // Explicitly set watch options: 
     watchOptions: { 
     aggregateTimeout: 300, 
     poll: true 
     } 
    }) 
    ] 
}); 
+0

你能分享你的配置文件 – Neil

+1

@Neil你去那裏的實際變化:) – Bob