Angular CLI error in console

问题:

I really hope someone can shead some light on this as its driving me mad. I'm getting the following console error:

Uncaught SyntaxError: Unexpected token import
at eval (<anonymous>)
at webpackJsonp.12.module.exports (addScript.js:9)
at Object.512 (vendor.ts?d8d9:1)
at __webpack_require__ (bootstrap 9a38e78…:52)
at Object.1054 (scripts.bundle.js:31)
at __webpack_require__ (bootstrap 9a38e78…:52)
at webpackJsonpCallback (bootstrap 9a38e78…:23)
at scripts.bundle.js:1

It is being caused by modernizrn in my vendor.ts file:

import './modernizr.js';

One thing I'm not sure of is if it should be in the vendor.ts file or in the scripts section of the angular-cli.json file. I've been trying to work out what the difference is between the vendor.ts and scripts section are but I've had no luck. If anyone can tell me that would be great.

Anyway, if I try and include modernizr in the scripts section in angular-cli.json then the project won't build. Can anyone help me out here? Is it just that modernizr can't work properly with Angular 2 or is it me (more likely), any help will be much appreciated.

回答1:

Here is how to get it working:

1. Download and install modernizr with: npm install --save-dev modernizr

2. Compile it on the command line: node .\node_modules\modernizr\bin\modernizr -c .\node_modules\modernizr\lib\config-all.json

3. Take the generated modernizr.js and put it in the "src" directory. Or anywhere you want.

4. Add it to your angular-cli.json, under scripts. The path is relative to your 'src' directory.

   "scripts": [ "./modernizr.js" ],