Shared Nativescript Angular Monorepo main.tns.ts file is not in files or includes in tsconfig

Issue

How do I have a tsconfig.app.json and a tsconfig.tns.json for angular and nativescript/angular for ns8, angular 12 and nativescript/webpack 5

I have a shared Angular and Nativescript repository that gets served for web and mobile.

Angular / Nativescript monorepos have used tsconfig.app.json (angular.json) and tsconfig.tns.json (nativescript/webpack loads this in) to differentiate main.ts vs main.tns.ts loaders.

I have upgraded to @nativescript/webpack 5 and it consistently uses only tsconfig.app.json (loading main.ts which is detailed in angular.json)

Okay! Looks like I need to add a plugin in Nativescript/webpack to tell it to use the tsconfig. Which logs out like it’s using it but Angular still is using tsconfig.app.json (where main.tns.ts doesn’t exist…. and I can’t add it because then it loads web funky)

const webpack = require('@nativescript/webpack');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
module.exports = env => {
  webpack.init(env)
  webpack.useConfig('angular');

  webpack.chainWebpack(config => {
    config.resolve.plugin('TsconfigPathsPlugin').use(
      new TsconfigPathsPlugin({
        configFile: './tsconfig.tns.json',
        logLevel: "info",
      })
    )
  });

  return webpack.resolveConfig();
}

Solution

Nativescript removed the monorepo style code sharing.

Move to NX using Nativescript/NX

Answered By – pandabuilt

Answer Checked By – Mary Flores (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.