我正在尝试配置一个新的webpack + angular2项目,我遇到了一些错误:
当我使用“npm start”时,我遇到了很多这样的错误:
ERROR in ./~/reflect-metadata/Reflect.ts
(953,21): error TS2384: Overload signatures must all be ambient or non-ambient.
ERROR in ./~/reflect-metadata/Reflect.ts
(985,21): error TS2384: Overload signatures must all be ambient or non-ambient.
ERROR in ./~/reflect-metadata/Reflect.ts
(1021,21): error TS2384: Overload signatures must all be ambient or non-ambient.
ERROR in /home/gchiara/desenvolvimento/honda/typings/globals/node/index.d.ts
(2301,5): error TS2309: An export assignment cannot be used in a module with other exported elements.
这是我的代码:
的package.json
{
"name": "app",
"version": "1.0.0",
"description": "app",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"typings": "typings",
"start": "webpack-dev-server --inline --progress --port 3000"
},
"author": "",
"license": "ISC",
"dependencies": {
"@angular/common": "2.0.0-rc.4",
"@angular/compiler": "2.0.0-rc.4",
"@angular/core": "2.0.0-rc.4",
"@angular/forms": "0.2.0",
"@angular/http": "2.0.0-rc.4",
"@angular/platform-browser": "2.0.0-rc.4",
"@angular/platform-browser-dynamic": "2.0.0-rc.4",
"@angular/router": "3.0.0-beta.1",
"@angular/router-deprecated": "2.0.0-rc.2",
"@angular/upgrade": "2.0.0-rc.4",
"angular2-in-memory-web-api": "0.0.14",
"angular2-template-loader": "^0.4.0",
"core-js": "^2.4.1",
"html-loader": "^0.4.3",
"html-webpack-plugin": "^2.22.0",
"reflect-metadata": "^0.1.3",
"rxjs": "^5.0.0-beta.6",
"ts-loader": "^0.8.2",
"typescript": "^1.8.10",
"typings": "^1.3.2",
"webpack": "^1.13.1",
"webpack-dev-middleware": "^1.6.1",
"webpack-dev-server": "^1.14.1",
"webpack-merge": "^0.14.1",
"zone.js": "^0.6.12"
},
"devDependencies": {
"concurrently": "^2.0.0"
}
}
webpack.config.js
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
'polyfills': './src/polyfills.ts',
'vendor': './src/vendor.ts',
'app': './src/app.ts'
},
output: {
filename: '[name].js'
},
resolve: {
extensions: ['', '.js', '.ts']
},
module: {
loaders: [
{
test: /\.ts$/,
loaders: ['ts', 'angular2-template-loader']
},
{
test: /\.html$/,
loader: 'html'
},
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: ['app', 'vendor', 'polyfills']
}),
new HtmlWebpackPlugin({
template: './src/index.html'
})
],
devServer: {
historyApiFallback: true,
stats: 'minimal'
}
}
polyfills.ts
import 'core-js/es6';
import 'reflect-metadata';
require('zone.js/dist/zone');
if (process.env.ENV === 'production') {
// Production
} else {
// Development
Error['stackTraceLimit'] = Infinity;
require('zone.js/dist/long-stack-trace-zone');
}
vendor.ts
// Angular 2
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';
import 'rxjs';
app.ts
import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppComponent } from './app/app.component';
if (process.env.ENV === 'production') {
enableProdMode();
}
bootstrap(AppComponent, []);
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app',
templateUrl: './app.component.html'
})
export class AppComponent {
}
应用程序运行正常,但我在控制台中遇到了大量错误。 有谁知道为什么?
谢谢!
答案 0 :(得分:4)
这是因为reflect-metadata@0.1.4。
降级到reflect-metadata@0.1.3以暂时避免这些错误!
答案 1 :(得分:1)
这是因为我认为代码中存在动态需求。绕过它的方法是使用ContextREplacementPlugin
。至少如果你使用的是webpack 1.x.也许webpack2会为你做这件事。
new webpack.ContextReplacementPlugin(/reflect/, /^$/)
答案 2 :(得分:0)
升级到webpack2解决了这个问题。