带有Webpack 2和Angular 2的TS2304 [英] TS2304 with Webpack 2 and Angular 2

问题描述

我一直在关注angular的文档使用角度2的webpack2.我的代码(github src 此处)是使用 webpack.dev.js 方案.

I've been following angular's documentation on how to use webpack 2 with angular 2. My code (github src here) is set up up with the webpack.dev.js scenario.

使用 npm start (例如， webpack-dev-server --inline --progress --port 8080 )运行开发版本会产生一系列TS2304 错误，例如

Running the dev build using npm start (i.e., webpack-dev-server --inline --progress --port 8080) gives a series of TS2304 errors, such as

ERROR in [at-loader] src\app\app.component.ts:5:15
    TS2304: Cannot find name 'require'.

ERROR in [at-loader] src\app\app.component.ts:6:14
    TS2304: Cannot find name 'require'.

出了什么问题?

推荐答案

确保已安装 @ types/node .

然后在 tsconfig.json 文件中写入"types":["jasmine"，"node"] 那么此错误将消除.

then write "types": ["jasmine","node"] in tsconfig.json file then this error will remove.

因为我也面临着同样的错误.这个解决方案对我有用.

because same error is also facing by me. this solution is worked for me.

我的tsconfig.json

my tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "types": ["jasmine","node"]
  }
}

和package.json

and package.json

{
  "name": "webpackCreator",
  "version": "1.0.0",
  "description": "A webpack starter for Angular",
  "scripts": {
    "start": "webpack-dev-server --inline --progress --port 8080",
    "test": "karma start",
    "build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail"
  },
  "license": "MIT",
  "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/platform-browser": "~2.4.0",
    "@angular/platform-browser-dynamic": "~2.4.0",
    "@angular/router": "~3.4.0",
    "core-js": "^2.4.1",
    "rxjs": "5.0.1",
    "zone.js": "^0.7.4"
  },
  "devDependencies": {
    "@types/jasmine": "^2.5.41",
    "@types/node": "^6.0.45",
    "angular2-template-loader": "^0.6.0",
    "awesome-typescript-loader": "^3.0.0-beta.18",
    "css-loader": "^0.26.1",
    "extract-text-webpack-plugin": "2.0.0-beta.5",
    "file-loader": "^0.9.0",
    "html-loader": "^0.4.3",
    "html-webpack-plugin": "^2.16.1",
    "jasmine-core": "^2.4.1",
    "karma": "^1.2.0",
    "karma-jasmine": "^1.0.2",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^2.0.1",
    "null-loader": "^0.1.1",
    "phantomjs-prebuilt": "^2.1.7",
    "raw-loader": "^0.5.1",
    "rimraf": "^2.5.2",
    "style-loader": "^0.13.1",
    "typescript": "~2.0.10",
    "webpack": "2.2.0",
    "webpack-dev-server": "2.2.0-rc.0",
    "webpack-merge": "^2.4.0"
  }
}

这篇关于带有Webpack 2和Angular 2的TS2304的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！