我目前的webpack安裝有問題..我找不到它。 我使用的是Angular2 + Webpack2 + AwesomeTypescriptLoader。應用程序已啓動並正在運行,但webpack不會正確重新編譯我的應用程序。每當我在我的項目更改TS文件,我得到Webpack2/awesome-typecript Loader似乎並沒有編譯
[在裝載機在一個單獨的進程正在檢查開始...
[在裝載機]好,0.985秒。
所以它似乎承認的變化,但我的bundle/js輸出文件從不更新。當我在後臺運行tsc -w的時候,一切正常......但這不應該是必需的,對吧?
任何人都可以發現我的錯誤嗎?非常感謝你!
這裏是我的配置文件:
tsconfig:
{
"compilerOptions": {
//"inlineSourceMap": true,
//"inlineSources": true,
"module": "commonjs",
"moduleResolution": "node",
"target": "es5",
"sourceMap": true,
"rootDir": ".",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": true,
"noImplicitAny": false
},
"exclude": [
"bin",
"node_modules",
"wwwroot/dist"
]
}
的WebPack:
"use strict";
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var path = require('path');
var CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
entry: {
"polyfills": path.resolve("./wwwroot/app/base/polyfills.ts"),
"app": path.resolve("./wwwroot/app/base/main.ts"),
"vendor": path.resolve("./wwwroot/app/base/vendors.ts")
},
devtool: 'source-map',
output: {
filename: "[name].bundle.js",
chunkFilename: "[id].chunk.js",
path: "./wwwroot/dist/",
publicPath: "./dist/"
},
watch: true,
resolve: {
extensions: ['', '.js', '.ts', '.html']
},
module: {
loaders: [
//Typescript
{
test: /\.tsx?$/,
loaders: ['angular2-template-loader', 'awesome-typescript-loader']
},
// SASS
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass'],
exclude: '/node_modules/'
},
{
test: /\.html$/,
loaders: ['raw-loader'],
exclude: "./wwwroot/index.html"
},
// Fonts & Files
{
test: /\.(ttf|eot|txt|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
loader: 'file-loader',
exclude: '/node_modules/'
}
]
},
noParse: [/moment.js/],
plugins: [
//new webpack.OldWatchingPlugin(),
// new webpack.optimize.UglifyJsPlugin({
// compressor: {
// warnings: false
// }
// }),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
}),
new webpack.optimize.CommonsChunkPlugin({
name: ["app", "vendor", "polyfills"]
}),
new HtmlWebpackPlugin({
template: './wwwroot/index.html'
})
]
};
,我使用的版本:
{
"version": "0.0.1",
"name": "someapp",
"private": true,
"dependencies": {
"@angular/common": "2.4.0",
"@angular/compiler": "2.4.0",
"@angular/core": "2.4.0",
"@angular/forms": "2.4.0",
"@angular/http": "2.4.0",
"@angular/material": "2.0.0-beta.1",
"@angular/platform-browser": "2.4.0",
"@angular/platform-browser-dynamic": "2.4.0",
"@angular/router": "3.4.0",
"@types/hammerjs": "^2.0.34",
"@types/lodash": "^4.14.34",
"angular2-color-picker": "^1.3.0",
"core-js": "^2.4.1",
"html-webpack-plugin": "^2.16.2",
"jquery": "^2.2.0",
"lodash": "^4.15.0",
"moment": "^2.14.1",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.1",
"tablesorter": "2.25.5",
"webpack": "1.13.2",
"zone.js": "0.7.2"
},
"devDependencies": {
"angular2-template-loader": "^0.5.0",
"awesome-typescript-loader": "3.0.0-beta.17",
"raw-loader": "^0.5.1",
"clean-webpack-plugin": "^0.1.9",
"css-loader": "^0.23.1",
"html-loader": "^0.4.3",
"node-sass": "^4.1.1",
"sass-loader": "^4.1.1",
"style-loader": "^0.13.1",
"typescript": "2.0.10",
"typings": "1.3.3"
}
}
編輯:這是與webpack 2.2.0-rc.4 btw一樣。
而且,決心包含 '的.ts',但不是' .tsx」。這兩個例子都有'.ts','.tsx','.js','.jsx''。 – Kody
這並沒有改變任何東西:(我仍然得到AT-Loader似乎認出我的改變的消息('[at-loader]檢查在單獨的進程中開始...&[at-loader]好的,0.985秒。 )但是我的軟件包似乎沒有更新:( –
啊,好吧,我現在只能猜測這是一些小的差異,你可以嘗試的其他東西是按照我列出的例子,並得到一個裸機項目運行如你所期望的那樣,然後將這些改變移植到你的應用程序中,放棄你的應用程序的版本並且只添加你所需要的版本 – Kody