Доброго времени суток. Локально работаю с webpack-dev-server, так как собираю все вебпаком на продакшн. Когда запускаю сервер с модами --inline --hot --progress для разработки, то он запускается нормально по
localhost:8080, но когда я делаю изменения в файлах, то сервер не перекомпилирует приложение и мне приходится перезапускать его. Подскажите почему так? Как сделать автоперекомпиляцию файлов при смене кода?
Вот package.json:
{
"name": "angular2-starter",
"version": "0.2.5",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/mirkonasato/angular2-course-webpack-starter.git"
},
"private": true,
"scripts": {
"build": "webpack --progress",
"build:prod": "cross-env APP_ENVIRONMENT=production webpack -p --progress",
"postinstall": "typings install",
"serve": "webpack-dev-server --inline --hot --progress"
},
"dependencies": {
"@angular/common": "2.2.3",
"@angular/compiler": "2.2.3",
"@angular/compiler-cli": "2.2.3",
"@angular/core": "2.2.3",
"@angular/forms": "2.2.3",
"@angular/http": "2.2.3",
"@angular/platform-browser": "2.2.3",
"@angular/platform-browser-dynamic": "2.2.3",
"@angular/platform-server": "2.2.3",
"@angular/router": "3.2.3",
"core-js": "2.4.1",
"rxjs": "5.0.0-beta.12",
"zone.js": "0.6.26"
},
"devDependencies": {
"@ngtools/webpack": "1.1.9",
"angular2-perfect-scrollbar": "^1.1.0",
"angular2-template-loader": "0.6.0",
"cross-env": "3.1.3",
"enhanced-resolve": "3.0.0",
"html-webpack-plugin": "2.24.1",
"raw-loader": "0.5.1",
"rimraf": "2.5.4",
"ts-loader": "1.3.0",
"typescript": "2.0.10",
"typings": "2.0.0",
"webpack": "2.1.0-beta.27",
"webpack-dev-server": "^2.1.0-beta.12"
}
}
Вот webpack.config.js:
var webpack = require('webpack');
var ngToolsWebpack = require('@ngtools/webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var appEnvironment = process.env.APP_ENVIRONMENT || 'development';
var isProduction = appEnvironment === 'production';
var webpackConfig = {
entry: {
'app': './src/main.ts',
'polyfills': [
'core-js/es6',
'core-js/es7/reflect',
'zone.js/dist/zone'
]
},
output: {
path: __dirname + '/dist',
filename: '[name].js'
},
module: {
loaders: [
{ test: /\.ts$/, loader: isProduction ? '@ngtools/webpack' : ['ts-loader', 'angular2-template-loader'] },
{ test: /\.html$/, loader: 'raw-loader' },
{ test: /\.css$/, loader: 'raw-loader' }
]
},
resolve: {
extensions: [ '.js', '.ts', '.html', '.css' ]
},
plugins: [
// see https://github.com/angular/angular/issues/11580
new webpack.ContextReplacementPlugin(
/angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
'./src'
),
new webpack.optimize.CommonsChunkPlugin({
name: 'polyfills'
}),
new HtmlWebpackPlugin({
template: './src/index.html'
}),
new webpack.DefinePlugin({
app: {
environment: JSON.stringify(appEnvironment)
}
})
],
watch: true
};
if (isProduction) {
webpackConfig.plugins.push(new ngToolsWebpack.AotPlugin({
tsConfigPath: './tsconfig.json',
entryModule: './src/app/app.module#AppModule'
}));
}
module.exports = webpackConfig;
Вот структура проекта:
prntscr.com/dmoawf