Migration steps to new code-shared structure

[Fatme]

The new code-shared structure is based on remapped imports and we strongly recommended to use them in code-shared applications. This way, typescript compiler will take the correct file (with .tns or .web extension) depending on the platform you're building for - web or mobile. Here are the steps that you need to follow in order to migrate existing code-shared application with legacy structure to the new structure:

Setup correctly paths property inside tsconfig files

tsconfig.json

{
    "compilerOptions": {
        "paths": {
            "@src/*": [
                "src/*.android.ts",
                "src/*.ios.ts",
                "src/*.tns.ts",
                "src/*.web.ts",
                "src/*.ts"
            ]
        }
    }
}

tsconfig.tns.json

{
  "compilerOptions": {
      "paths": {
            "@src/*": [
                "src/*.tns.ts",
                "src/*.ts"
            ]
        }
    }
}

tsconfig.app.json

{
  "compilerOptions": {
      "paths": {
            "@src/*": [
                "src/*.web",
                "src/*"
            ]
        }
    }
}

Fix all relative imports inside project

The relative imports should be migrated to starts with @src as only non-relative imports can be resolved through path mapping and TypeScript compiler is already configured to understand @src symbol. This can be achieved automatically using the @nativescript/tslint-rules package.

Setup @nativescript/tslint-rules

Install it into project

npm i @nativescript/tslint-rules --save-dev

Configure tslint.json

{
  "rulesDirectory": [
    "node_modules/codelyzer",
    "@nativescript/tslint-rules"
  ],
  "rules": {
    "prefer-mapped-imports": [
      true,
      {
        "prefix": "@src/",
        "prefix-mapped-to": "src/",
        "base-url": "."
      }
    ]
  }
}

Execute the rules

./node_modules/.bin/tslint --project ./tsconfig.tns.json --fix

After that all relative imports should be changed and should start with @src symbol.