只是把它放在那里看看其他人是否也遇到这个问题......
我已经使用 webpack 作为我的构建工具,使用 typescript 构建了一个 Angular 2 应用程序,一切都运行良好,但是我注意到 typescript 编译超级超级慢,我现在只有 12 秒......,而且很明显,这是这一切都是由于打字稿编译过程......
我使用 ts-loader 或 Awesome-typescript-loader 得到了类似的结果,如果我注释掉这个加载器,我的构建时间会下降到大约 1 秒......
经过一些研究,编译打字稿时“慢”时间似乎是“正常”的,但是 12 秒是正常的吗?
旧帖子暗示这可能是由于节点版本冲突,我当前运行的是 v4.4.2...
下面是我的 webpack 代码,以防有人发现那里有问题。Uglify 部分中的注释代码是由于 Angular 2 一侧的一些“错误”造成的...
const path = require('path');
const merge = require('webpack-merge');
const webpack = require('webpack');
const NpmInstallPlugin = require('npm-install-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const TARGET = process.env.npm_lifecycle_event;
const PATHS = {
app: path.join(__dirname, 'app'),
dist: path.join(__dirname, 'dist')
};
const common = {
entry: {
vendor: ['./app/vendor.ts'],
main: ['./app/boot.component.ts']
},
output: {
filename: '[name].[hash].bundle.js',
path: PATHS.dist
},
resolve: {
extensions: ['', '.js', '.ts']
},
plugins: [
new HtmlWebpackPlugin({
title: 'Qarrot Performance',
template: 'index.template.ejs',
commonStyles: [
'/public/styles/vendor/normalize.css',
'/public/styles/main.css'
],
commonScripts: [],
baseHref: '/',
unsupportedBrowser: true,
mobile: true,
appMountId: 'app'
}),
],
module: {
loaders: [
{
test: /\.ts$/,
exclude: /node_modules/,
loaders: ['ts-loader']
},
{
test: /\.scss$/,
loader: 'raw-loader!sass-loader'
},
{
test: /\.html$/,
loader: "html"
}
]
}
}
// Dev Settings
if(TARGET === 'start' || !TARGET) {
module.exports = merge(common, {
devtool: 'eval-source-map',
devServer: {
contentBase: PATHS.build,
historyApiFallback: true,
hot: true,
inline: true,
progress: true,
stats: 'errors-only',
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new NpmInstallPlugin({
save: true
})
]
});
}
// Prod Settings
if(TARGET === 'build') {
module.exports = merge(common, {
devtool: 'cheap-module-source-map',
plugins: [
// new webpack.optimize.UglifyJsPlugin({
// beautify: false,
// mangle: false,
// compress : { screw_ie8 : true },
// comments: false
// }),
new webpack.optimize.DedupePlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': '"production"'
}),
new CopyWebpackPlugin([
{ from: 'public', to: 'public' }
]),
new webpack.optimize.CommonsChunkPlugin({
names: ['vendor', 'manifest']
}),
]
});
}
我也在 Mac 上,运行 Angular 2 beta.15 和 webpack 版本 1.12,下面是我的 tsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"compileOnSave": false,
"exclude": [
"node_modules",
"typings/main",
"typings/main.d.ts"
]
}