Installation error

[DanielKucal]

Hi, so I tried to install nativescript-dev-webpack into my angular2-webpack-starter-based project and I got the following error:

Daniels-MBP:zoomsphere2-web danielkucal$ npm install --save-dev nativescript-dev-webpack

[email protected] postinstall /Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack
node postinstall.js

Creating file: /Users/danielkucal/Applications/Angular2/zoomsphere2-web/app/vendor-platform.android.ts
fs.js:584
return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
^

Error: ENOENT: no such file or directory, open '/Users/danielkucal/Applications/Angular2/zoomsphere2-web/app/vendor-platform.android.ts'
at Object.fs.openSync (fs.js:584:18)
at Object.fs.writeFileSync (fs.js:1316:33)
at copyTemplate (/Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack/installer.js:274:12)
at copyAppTemplate (/Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack/installer.js:253:5)
at /Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack/installer.js:59:9
at Array.forEach (native)
at Object.addProjectFiles (/Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack/installer.js:57:31)
at Object. (/Users/danielkucal/Applications/Angular2/zoomsphere2-web/node_modules/nativescript-dev-webpack/postinstall.js:3:11)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
npm WARN @ngtools/[email protected] requires a peer of [email protected] but none was installed.
npm ERR! Darwin 16.5.0
npm ERR! argv "/usr/local/Cellar/node/7.7.4/bin/node" "/usr/local/bin/npm" "install" "--save-dev" "nativescript-dev-webpack"
npm ERR! node v7.7.4
npm ERR! npm v4.1.2
npm ERR! code ELIFECYCLE

npm ERR! [email protected] postinstall: node postinstall.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script 'node postinstall.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the nativescript-dev-webpack package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node postinstall.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs nativescript-dev-webpack
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls nativescript-dev-webpack
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! /Users/danielkucal/Applications/Angular2/zoomsphere2-web/npm-debug.log

I have tns configured and use OS X Sierra. npm-debug.log
File app/vendor-platform.android.ts hasn't been created at all so then I did it manually, but result was the same. Any solutions or alternatives to integrate nativescript into my project?

[sis0k0]

The problem is that the seed has a different file structure compared to a nativescript project. The first one has a 'src' folder that contains the 'app' folder. Can you tell me a bit more about your project? Do you have a web application that you want to extend to be a mobile one too or you are using the seed to create just a mobile app?

[DanielKucal]

Hi @sis0k0, thanks for your interest! I have pretty large web application and need to create mobile apps on this base. In this project Angular templates are being loaded using require() function, so I'll want to take advantage of it to get right template for web / mobile app. Doable?

[sis0k0]

"Angular templates are being loaded using require() function"

Do you mean something like the following:

@Component({
    templateUrl: `some-template.${platform}.html`
})

?

[DanielKucal]

Rather:

@Component({
    template: require('./some-template.component.html')
})

and using some custom webpack loader. I'll try it out...
I've changed project dir in installer.js and it worked, thanks!

[sis0k0]

Great! I would have suggested the approach with a custom loader. If you have any problems with that, feel free to comment and we'll reopen the issue.

[DanielKucal]

Actually although installation worked, I am unable to execute any nativescript commands as they can't find the project... Even setting --path does not help.

Daniels-MBP:zoomsphere2-web danielkucal$ tns build ios
No project found at or above '/Users/danielkucal/Applications/Angular2/zoomsphere2-web' and neither was a --path specified.

Daniels-MBP:zoomsphere2-web danielkucal$ tns build ios --path=/Users/danielkucal/Applications/Angular2/zoomsphere2-web/src
No project found at or above '/Users/danielkucal/Applications/Angular2/zoomsphere2-web/src' and neither was a --path specified.

Daniels-MBP:zoomsphere2-web danielkucal$ npm run build-ios-bundle

[email protected] build-ios-bundle /Users/danielkucal/Applications/Angular2/zoomsphere2-web
npm run ns-bundle --ios --build-app

[email protected] ns-bundle /Users/danielkucal/Applications/Angular2/zoomsphere2-web
ns-bundle

Running webpack for ios...
No project found at or above '/Users/danielkucal/Applications/Angular2/zoomsphere2-web' and neither was a --path specified.
Unknown command 'clean-app-ios'. Try '$ tns help' for a full list of supported commands.
child process exited with code 127

[DanielKucal]

@sis0k0, I had to manually add nativescript section into my package.json - I think it should be performed by this installer or at least added to readme, or did I just miss it somewhere?

For anyone experiencing this issue, just add the following as top-level property to your app package.json file (i.e. before scripts):

  "nativescript": {
    "id": "your.app.name",
    "tns-ios": {
      "version": "2.5.0"
    },
    "tns-android": {
      "version": "2.5.0"
    }
  },