Nativescript: Update DevelopmentWorkflow.md for v6

Created on 28 Aug 2019  路  11Comments  路  Source: NativeScript/NativeScript

I'm trying to test a contribution to the v6 tns-core-modules and tns-core-modules-widgets, and running into problems following the DevelopmentWorkflow.md. I think it is outdated.

In short, I want to modify a .ts file in tns-core-modules and be able to test the modification in a v6 NativeScript app in another directory.

A few issues with the current DevelopmentWorkflow.md:

  1. The initial setup (npm install) does not npm link
  2. Running Another App indicates changes require TS rebuild (tsc), however it does not specify which package.json script target to run. My hunch is it is dev-tsc-all but this script has a bug in it (pr below) AND after running, the .js files end up in bin/dist/tns-core-modules/ without a package.json (so npm link will not work). compile-all script does the same.
  3. dev-link-tns-core-modules-widgets script references a dist/package dir that DNE.

I'm happy to do the work to PR an update to the docs, however I need some clarity on the right way to do it 1st.

Here is my workflow - what am I doing wrong?

  1. Fork and clone
  2. git checkout -b my-feature/fix-branch
  3. npm install
  4. npm run compile-all
  5. From root of my NS proj: npm link ../<where I cloned>/tns-core-modules-widgets/ && npm link ../<where I cloned>/tns-core-modules
  6. tns debug ios --debug-brk --env.sourceMap
docs

Most helpful comment

For anyone getting the Error: Could not load CSS from app.css: TypeError: Expected module identifier to be a string. css issue.

Update nativescript-dev-webpack to 1.2 (npm install --save-dev nativescript-dev-webpack) as per @elena-p comment here: https://github.com/NativeScript/nativescript-angular/issues/1975#issuecomment-530243719 .

I had this issue and upgrading nativescript-dev-webpack fixed it.

All 11 comments

@rynop the developer workflow document is now being updated via this PR - can you try the simplified steps and let us know if that is works for you.

Unfortunately, that did not work either. Reproduction steps:

$ node --version
v10.16.0
$tns --version
6.0.3
$ git clone https://github.com/NativeScript/NativeScript
$ tns create v6test --ng --appid com.rynop.v6test
$ cd v6test
$ npm install --save ../NativeScript/tns-core-modules
+ [email protected]
$ grep tns-core package.json
    "tns-core-modules": "file:../NativeScript/tns-core-modules",

tns run ios to emulator, crashes. Full log here

I then:

$ cd ../NativeScript && npm install

From here I can't determine the recommended way to compile (tsc). Is it npm run compile-all? Is it npm run tsc-w? I'm going to be making changes to tns-core-modules AND tns-core-modules-widgets so my guess is npm run tsc-w. A clear recommendation needs to be documented in DevelopmentWorkflow.md.

$ npm run tsc-w

_In another tab:_

$ cd projects/v6test
$ tns run ios

Crashes again, this time with a different error:

CONSOLE ERROR file:///src/Users/ryan/projects/NativeScript/tns-core-modules/trace/trace.ts:184:30 Error: Could not load CSS from app.css: TypeError: Expected module identifier to be a string.

Full log here.

Hopefully this helps you reproduce. Thanks in advance for your help as I'm blocked on this.

I got the same exact error CONSOLE ERROR file:///src/Users/ryan/projects/NativeScript/tns-core-modules/trace/trace.ts:184:30 Error: Could not load CSS from app.css: TypeError: Expected module identifier to be a string.

Same error here, any fix?

I'll make a new issue that is specifically targeted at this error.

@rynop sure, please add a link here once created.

@vpiskunov @mohammedzamakhan please try reproduction steps mentioned in the new issue above. Note you need to update master to pull in v6.1.0 release.

If you are able to reproduce, I'd appreciate a thumbs up or some comment in new issue to help get some visibility. I've been blocked for ~2wks. My hope is I'm just doing something stupid / missing a step.

FWIW since v6.1.0 the crash is manifesting itself without the error message noted in this issue.

I simply created a new nativescirpt app using Angular CLI after installing nativescript schematics npm i -g @nativescript/schematics using the command

ng new --schematics=@nativescript/schematics HelloWorld

and ran preview using npx --p nativescript tns preview, and I get this error

For anyone getting the Error: Could not load CSS from app.css: TypeError: Expected module identifier to be a string. css issue.

Update nativescript-dev-webpack to 1.2 (npm install --save-dev nativescript-dev-webpack) as per @elena-p comment here: https://github.com/NativeScript/nativescript-angular/issues/1975#issuecomment-530243719 .

I had this issue and upgrading nativescript-dev-webpack fixed it.

Hi all,
The problem with the modules linking for NativeScript Angular projects seems to be connected to nativescript-dev-webpack. I am closing this issue in favour of https://github.com/NativeScript/nativescript-dev-webpack/issues/1044

Should npm run tsc-w be added to DevelopmentWorkflow.md? Or one of the other compile scripts in package.json? For example, following https://github.com/NativeScript/NativeScript/blob/master/DevelopmentWorkflow.md#running-another-app will not work unless some sort of compile is done. A tns-core-modules* noob like me was/is not clear on the recommended way.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

guillaume-roy picture guillaume-roy  路  3Comments

minjunlan picture minjunlan  路  3Comments

rLoka picture rLoka  路  3Comments

fmmsilva picture fmmsilva  路  3Comments

NickIliev picture NickIliev  路  3Comments