Have tried to setup an Angular 4 environment using this Video Tutorial form Jordan Lesson:
In trying to learn along with the video and files for download, the following occurs:
First run: I get TS2304: Cannot find name ‘require’ ERROR in [at-loader] in ./src/app/app.component.ts and ./src/polyfills.ts
This I can fix by placing the following in tsconfig.json and tsconfig-aot.json compilerOptions section:
“typeRoots”: [
“node_modules/@types”
]
There is also the following error while running ‘npm run webpack-prod’:
‘output.filename’ is required, either in config file or as --output-filename
This I can fix by changing the syntax of the command to: 'npm run webpack-prod --config config/webpack.prod.js
But now that I can run this command, I get the following error:
> lesson-on-coding-angular-webpack@1.0.0 webpack-prod C:\wamp64\www\angular-tute
\angFour
> cross-env NODE_ENV=production webpack "config/webpack.prod.js"
@@@@@@@@@@@@@@@@@@PROD@@@@@@@@@@@@@@@@@@@@
[at-loader] Using typescript@2.3.4 from typescript and "tsconfig.json" from C:\w
amp64\www\angular-tute\angFour\tsconfig-aot.json.
[at-loader] Checking started in a separate process...
[at-loader] Ok, 1.764 sec.
Hash: 8591836aef37984561ee
Version: webpack 2.2.1
Time: 45083ms
[11] ./~/@angular/core/@angular/core.es5.js 487 kB {0} [built]
[17] ./~/@angular/platform-browser/@angular/platform-browser.es5.js 141 kB {0}
[built]
[24] ./~/@angular/common/@angular/common.es5.js 130 kB {0} [built]
[128] ./~/@angular/http/@angular/http.es5.js 74.6 kB {0} [built]
[129] ./~/@angular/platform-browser-dynamic/@angular/platform-browser-dynamic.e
s5.js 5.88 kB {0} [built]
[130] ./~/@angular/router/@angular/router.es5.js 214 kB {0} [built]
[131] ./aot/src/app/app.module.ngfactory.ts 2.81 kB {1} [built]
[132] ./~/core-js/es7/reflect.js 510 bytes {2} [built]
[133] ./~/rxjs/Rx.js 9.58 kB {0} [built]
[134] ./~/zone.js/dist/zone.js 126 kB {2} [built]
[303] ./~/rxjs/add/operator/windowToggle.js 241 bytes {0} [built]
[304] ./~/rxjs/add/operator/windowWhen.js 229 bytes {0} [built]
[443] ./src/main.aot.ts 262 bytes {1} [built]
[444] ./src/polyfills.ts 273 bytes {2} [built]
[445] ./src/vendor.ts 311 bytes {0} [built]
+ 431 hidden modules
ERROR in chunk app [initial]
webpack.prod.js
Conflict: Multiple assets emit to the same filename webpack.prod.js
ERROR in chunk polyfills [entry]
webpack.prod.js
Conflict: Multiple assets emit to the same filename webpack.prod.js
Child html-webpack-plugin for "index.html":
[0] ./~/html-webpack-plugin/lib/loader.js!./src/index.html 325 bytes {0}
[built]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! lesson-on-coding-angular-webpack@1.0.0 webpack-prod: `cross-env NODE_EN
V=production webpack "config/webpack.prod.js"`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the lesson-on-coding-angular-webpack@1.0.0 webpack-prod scrip
t.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Eric\AppData\Roaming\npm-cache\_logs\2017-11-02T01_16_17_3
95Z-debug.logI do not know how to fix this problem with Conflict: Multiple assets emit to the same filename. Can anyone help?
Thanks.