0

Angular2 (2.0.1) & Webpack 2 (2.1.0-beta.21) 問題はありません。nom run build:prod を実行できます...

Angular2 を最新バージョン (2.0.1) にアップグレードすると、

npm run build // => エラーなし

しかし、

npm run build:prod // => エラーが発生する

Failed to exec build:prod script..
.... `del-cli public/js/app && ngc -p tsconfig.aot.json && ngc -p 
tsconfig.aot.json && webpack --config webpack.config.prod.js --progress   
--profile --bail && del-cli 'public/js/app/**/*.js' 
'public/js/app/**/*.js.map' '!public/js/app/bundle.js'  
'!public/js/app/*.chunk.js' 'assets/app/**/*.ngfactory.ts' 
'assets/app/**/*.shim.ts'`

私のpackage.jsonの唯一の変更は次のとおりです。

....
"dependencies": {
"@angular/common": "2.2.0",
"@angular/compiler": "2.2.0",
"@angular/compiler-cli": "2.2.0",
"@angular/core": "2.2.0",
"@angular/forms": "2.2.0",
"@angular/http": "2.2.0",
"@angular/platform-browser": "2.2.0",
"@angular/platform-browser-dynamic": "2.2.0",
"@angular/platform-server": "2.2.0",
"@angular/router": "3.2.0",
"@angular/upgrade": "2.2.0",
....

# not changed

"devDependencies": {
"@types/core-js": "^0.9.34",
"@types/node": "^6.0.45",
"angular2-router-loader": "^0.3.2",
"angular2-template-loader": "^0.5.0",
"awesome-typescript-loader": "^2.2.4",
"del-cli": "^0.2.0",
"html-loader": "^0.4.4",
"raw-loader": "^0.5.1",
"typescript": "^2.0.3",
"webpack": "^2.1.0-beta.21",
"webpack-merge": "^0.14.1"

}

web pack.config.common.js

var webpack = require('webpack');

module.exports = {
entry: {
    'app': './assets/app/main.ts'
},

resolve: {
    extensions: ['.js', '.ts']
},

module: {
    loaders: [
        {
            test: /\.ts$/,
            loaders: [
                'awesome-typescript-loader',
                'angular2-template-loader',
                'angular2-router-loader'
            ]
        },
        {
            test: /\.html$/,
            loader: 'html-loader'
        },
        {
            test: /\.css$/,
            loader: 'raw-loader'
        }
    ]
},

plugins: [
    new webpack.ContextReplacementPlugin(
        // The (\\|\/) piece accounts for path separators in *nix and Windows
        /angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
        './src' // location of your src
    )
  ]
};

web pack.config.prod.js

var webpack = require('webpack');
var webpackMerge = require('webpack-merge');
var commonConfig = require('./webpack.config.common.js');

module.exports = webpackMerge.smart(commonConfig, {
entry: {
    'app': './assets/app/main.aot.ts'
},

output: {
    path: './public/js/app',
    filename: 'bundle.js',
    publicPath: '/js/app/',
    chunkFilename: '[id].[hash].chunk.js'
},

module: {
    loaders: [
        {
            test: /\.ts$/,
            loaders: [
                'awesome-typescript-loader',
                'angular2-template-loader',
                'angular2-router-loader?aot=true&genDir=public/js/app'
            ]
        }
    ]
},

plugins: [
    new webpack.NoErrorsPlugin(),
    new webpack.optimize.UglifyJsPlugin({
        sourceMap: false
    })
   ]
});

tsconfig.aot.json

{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false,
"outDir": "./public/js/app"
},
"exclude": [
"node_modules",
"dist",
"assets/app/polyfills.ts"
],

"angularCompilerOptions": {
"skipMetadataEmit" : true
}

}

4

1 に答える 1

1

最新の @angular、@angular-compiler、および @angular/compiler-cli (バージョン 2.2.0) および Web パック (バージョン 2.1.0-beta.21) を使用して問題が発生しました...最新バージョンでもテストしました2.2.1 / 2.1.0.beta.27 ...

本番スクリプトで、実行中

ngc -p tsconfig.aot.json

コンパイルはtsconfig.aot.jsonで指定されたディレクトリに.ngFactoryを出力します 

( outDir: " ./public/js/app"

プロジェクトと同じディレクトリ構造 ( /assets/app/... ) に連結されているため、Web パックで使用される最終的なパスは次のようになります。

./public/js/app/assets/app/..

このパスは、webpack ローダー (genDir パラメータ) によって認識される必要があるため、 webpack.confid.prod.jsで宣言する必要があります。

module: {
    loaders: [
        {
            test: /\.ts$/,
            loaders: [
                'awesome-typescript-loader',
                'angular2-template-loader',
                'angular2-router-loader?aot=true&genDir=public/js/app/assets/app'
            ]
        }
    ]
},
于 2016-11-21T11:55:58.437 に答える