我正在尝试编译我的angular4应用程序AOT并且卡在错误上:
TypeError: Cannot read property 'createRenderer' of undefined
at AnimationRendererFactory.createRenderer (http://localhost:8080/cwp/static/app.bundle.undefined.js:114555:54)
at DebugRendererFactory2.createRenderer (http://localhost:8080/cwp/static/app.bundle.undefined.js:13319:49)
at createRootData (http://localhost:8080/cwp/static/app.bundle.undefined.js:12759:53)
以下是我的相关配置:
tsconfig
{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"noEmit": true,
"noEmitHelpers": true,
"importHelpers": true,
"strictNullChecks": false,
"lib": [
"es2015",
"dom"
],
"noImplicitAny": false,
"suppressImplicitAnyIndexErrors": true
},
"include": [
"app/app.module.ts",
"app/**/*.ts",
"app/main.aot.ts"
],
"exclude": [
"node_modules",
"dist",
"**/*.spec.ts",
"**/*.e2e.ts",
"test",
"app/main.ts"
],
"angularCompilerOptions": {
"genDir": "compiled",
"skipMetadataEmit": true
}
}
webpack.config
var webpack = require('webpack');
const helpers = require('./helpers');
var version = '.' + process.env.version;
module.exports = function MakeConfig() {
var config = {};
config.entry = {
'polyfills': './polyfills.ts',
'app': ['./app/main.aot.ts' ]
};
config.output = {
path: helpers.root('dist'),
filename: "./[name].bundle" + version + ".js",
chunkFilename: "./[id].chunk" + version + ".js",
publicPath: '/cwp/static/'
};
config.module = {
rules: [
{
test: /\.ts$/,
use: [
{
loader: 'awesome-typescript-loader'
},
{
loader: 'angular2-template-loader'
},
{
loader: 'angular-router-loader?aot=true&genDir=compiled'
}
],
exclude: [/\.(spec|e2e)\.ts$/]
},
/* Raw loader support for *.html
* Returns file content as string
*
* See: https://github.com/webpack/raw-loader
*/
{
test: /\.(css|html)$/,
use: 'raw-loader'
},
{
test: /jquery/,
loader: 'expose-loader?$!expose-loader?jQuery'
}
]
};
config.plugins = [
];
config.resolve = {
extensions: ['.ts', '.js', '.css', '.html']
};
return config;
}();
main.aot.ts
import { platformBrowser } from '@angular/platform-browser';
import { AppModuleNgFactory } from '../compiled/app/app.module.ngfactory';
let Highcharts = require('highcharts/highstock');
require('highcharts/modules/map')(Highcharts);
require('highcharts/highcharts-more')(Highcharts);
require('highcharts/modules/solid-gauge')(Highcharts);
require('highcharts/modules/exporting')(Highcharts);
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
我正在使用angular v4.1.0和webpack v2.4.1。
有没有人遇到过类似的东西?