compiler_1.StaticSymbolResolver is not a constructor

[dgomezs]

Hi all,

I just created a new project using nativescript-cli tns create test-mobile-app-webpack --ng then navigate to the folder and install nativescript-dev-webpack npm install --save-dev nativescript-dev-webpack and try to launch it npm run start-android-bundle. I get the following warning and errors

WARNING in ./app.css
  resolve-url-loader cannot operate: CSS error
  /home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/app/app.css:6:426: property missing ':'
  at error (/home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/node_modules/css/lib/parse/index.js:62:15)

WARNING in ./app.css
  resolve-url-loader cannot operate: CSS error
  /home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/app/app.css:6:426: property missing ':'
  at error (/home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/node_modules/css/lib/parse/index.js:62:15)

ERROR in compiler_1.StaticSymbolResolver is not a constructor
Child app/app.component.html:
       [0] ./app.component.html 309 bytes {0} [built]
Child extract-text-webpack-plugin:
       [2] ../~/resolve-url-loader!../~/nativescript-css-loader!../~/nativescript-dev-webpack/platform-css-loader.js!./app.css 911 bytes {0} [built] [1 warning]
        + 2 hidden modules
    
    WARNING in ../~/resolve-url-loader!../~/nativescript-css-loader!../~/nativescript-dev-webpack/platform-css-loader.js!./app.css
      resolve-url-loader cannot operate: CSS error
      /home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/app/app.css:6:426: property missing ':'
      at error (/home/dgomezs/workspace/project-eutychia/test-mobile-app-webpack/node_modules/css/lib/parse/index.js:62:15)

Some information about my environment

tns --version -> 2.4.2
node -v --> 7.4.0
npm --version --> 4.0.5

Any idea what is wrong with my setup? You can access the project directly here

https://github.com/dgomezs/test-mobile-app-webpack

[sis0k0]

Hi, @dgomezs,

The problem is in the mismatching versions of @angular/compiler-cli and the other @angular packages.

1. If you want to use it with the official nativescript-angular-1.3.0 and @angular-2.3.1:
   Just update the version of @angular/compiler-cli to 2.3.1.

2. If you want to use it with nativescript-angular@next and @angular-2.4.3:

• Update all @angular deps to 2.4.3 and the @angular/router to 3.4.3.
• Update nativescript-angular to next.
• Update rxjs to ~5.0.1
• Update typescript to ~2.1.0
• If you haven't modified your tsconfig.aot.json, remove it and the nativescript-dev-webpack plugin will add the updated version for typescript 2.1+. If you have modified it, update it by adding the following paths:

   "baseUrl": ".",
    "paths": {
      "ui/*": ["node_modules/tns-core-modules/ui/*"],
      "platform": ["node_modules/tns-core-modules/platform"],
      "image-source": ["node_modules/tns-core-modules/image-source"],
      "xml": ["node_modules/tns-core-modules/xml"],
      "xhr": ["node_modules/tns-core-modules/xhr"],
      "text": ["node_modules/tns-core-modules/text"],
      "data": ["node_modules/tns-core-modules/data"],
      "fetch": ["node_modules/tns-core-modules/fetch"],
      "trace": ["node_modules/tns-core-modules/trace"],
      "fps-meter": ["node_modules/tns-core-modules/fps-meter"],
      "color": ["node_modules/tns-core-modules/color"],
      "application-settings": ["node_modules/tns-core-modules/application-settings"],
      "http": ["node_modules/tns-core-modules/http"],
      "camera": ["node_modules/tns-core-modules/camera"],
      "console": ["node_modules/tns-core-modules/console"],
      "timer": ["node_modules/tns-core-modules/timer"],
      "utils": ["node_modules/tns-core-modules/utils"],
      "location": ["node_modules/tns-core-modules/location"],
      "file-system": ["node_modules/tns-core-modules/file-system"],
      "application": ["node_modules/tns-core-modules/application"],
      "image-asset": ["node_modules/tns-core-modules/image-asset"],
      "connectivity": ["node_modules/tns-core-modules/connectivity"],
      "globals": ["node_modules/tns-core-modules/globals"],
    }

TL;DR
The reason why you ended up with @angular/compiler-cli v2.4.3 is that nativescript-dev-webpack 0.3.2 will add it as a dev dependency. Since the nativescript-angular support for 2.4 is not yet released, the official version will add 2.3 @angular packages.

[jpmoney]

I had the same issue and can confirm that with the identical versions of tns, node and npm and switching @angular/compiler-cli to 2.3.1 and running npm install the webpack build is now working properly!

Thanks for the help

[dgomezs]

@sis0k0 working on my side. Thank you very much for the help.