2017-02-09 7 views
1

각도 2로 webpack 2를 사용하는 방법에 대해 angle을 따라 왔습니다. 내 코드 (github src here)가 webpack.dev.js 시나리오로 설정되었습니다.TS2304 Webpack 2 및 Angular 2

잘못 무슨 일

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'. 

등, npm start이 (즉, webpack-dev-server --inline --progress --port 8080) TS2304 오류 일련의를 제공하여 dev에 빌드를 실행?

+0

@types를 제거하고 대신 입력을 시도했습니다. 여전히 동일한 오류가 발생합니다. .... 간단한 무언가를 놓치고 있어야합니다 .... –

+0

그래서 그냥 복제 빠른 앵글 빠른 시작, 그리고 아무런 문제를 구축하고 실행하는 것 같습니다. –

답변

5

@types/node을 설치했는지 확인하십시오.

"types": ["jasmine","node"]tsconfig.json 파일 에 쓰면이 오류가 제거됩니다.

같은 오류가 발생하기 때문에 이 솔루션은 나를 위해 일합니다.

내 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는

{ 
    "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" 
    } 
} 
+0

추가되었지만 기쁨이 없습니다 (필자는 typescript 컴파일러가 기본적으로 선택해야한다고 생각합니다). 'tsconfig.json'과 아마도'package.json'을 게시 할 수 있습니까? 차이점이 있는지 확인하십시오 - thnx. –

+0

이제 우리는 똑같은'tsconfig.json'과'package.json' 파일을 가지고 있습니다. 그러나 나는 여전히이 모든 오류를 가지고 있습니다. 관심있는 노드 중 어떤 버전을 설치 했습니까? –

+0

현재 노드 v6.9.1 및 npm 3.10.8 –

1

당신은 Node.js를의 typings이 필요합니다. 내 tsconfig.json이 추가

npm install @types/node --save-dev

+0

잘 알고 있습니다. 제 'package.json' [here] (https://github.com/jdbriaris/angular-webpack/blob/master/package.json) –

1

은 나를 위해 그것을 고정 :

"typeRoots": [ 
    "../node_modules/@types/" 
] 

내가 각도 2 웹팩 소개 (https://angular.io/docs/ts/latest/guide/webpack.html)

tsconfig.json을 다음과 같은 문제에 달렸다 가이드의 코드가 '최종 결과'zip 파일의 코드와 다릅니다 (https://angular.io/resources/zips/webpack/webpack.zip)

내 전체 tsconfig.json이 있습니다 :

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