search

ProgressNS / nativescript-ui-feedback

This repository is used for customer feedback regarding Telerik UI for NativeScript. The issues system here is used by customers who want to submit their feature requests or vote for existing ones.
Other
115 stars 21 forks source link

cannot compile nativescript-ui-sidedrawer plugin after Angular 9 upgrade #1469

Open aquinn637 opened 3 years ago

aquinn637 commented 3 years ago

I had a NativeScript app made with Angular 8.2.0 and NS 6.4.1. I had this plugin included in my project and it was working fine and I could compile the project.

I have followed these directions here: https://github.com/NativeScript/nativescript-angular/wiki/Updating-and-developing-for-@nativescript-angular-v9-with-Ivy-or-without To update my project to Angular 9.

When I run this command I get an error: tns build android --env.aot

Error:

tns build android --env.aot 
Preparing project...
Compiling nativescript-ui-sidedrawer-angular : module as esm5
Warning: Invalid constructor parameter decorator in /Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/nativescript-ui-sidedrawer/angular/fesm2015/nativescript-ui-sidedrawer-angular.js:
 () => [
    { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
    { type: ViewContainerRef, decorators: [{ type: Inject, args: [ViewContainerRef,] }] }
]
Error: Error on worker #1: Error: The given rootPath undefined is not a file of the program.
    at getRootFileOrFail (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/host/esm2015_host.js:2103:19)
    at Esm5ReflectionHost.Esm2015ReflectionHost.computePublicDtsDeclarationMap (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/host/esm2015_host.js:1500:27)
    at Esm5ReflectionHost.Esm2015ReflectionHost.getDtsDeclaration (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/host/esm2015_host.js:523:53)
    at DelegatingReflectionHost.getDtsDeclaration (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/host/delegating_host.js:60:34)
    at Object.wrapTypeReference (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/util.js:462:34)
    at Object.extractDirectiveMetadata (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/directive.js:236:27)
    at ComponentDecoratorHandler.analyze (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/component.js:143:47)
    at NgccTraitCompiler.TraitCompiler.analyzeTrait (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:345:40)
    at analyze (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:297:58)
    at _loop_1 (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:319:21)
    at ClusterMaster.onWorkerMessage (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:194:27)
    at /Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:54:95
    at ClusterMaster.<anonymous> (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:292:57)
    at step (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tslib/tslib.js:141:27)
    at Object.next (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tslib/tslib.js:122:57)
    at /Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tslib/tslib.js:115:75
    at new Promise (<anonymous>)
    at Object.__awaiter (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tslib/tslib.js:111:16)
    at EventEmitter.<anonymous> (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@angular/compiler-cli/ngcc/src/execution/cluster/master.js:286:32)
    at EventEmitter.emit (events.js:198:13)
/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/bin/cli.js:453
                throw err;
                ^

Error: NGCC failed.
    at NgccProcessor.process (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@ngtools/webpack/src/ngcc_processor.js:76:19)
    at compiler.hooks.environment.tap (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:579:31)
    at SyncHook.eval [as call] (eval at create (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:9:1)
    at SyncHook.lazyCompileHook (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/tapable/lib/Hook.js:154:20)
    at webpack (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack/lib/webpack.js:55:30)
    at processOptions (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/bin/cli.js:441:16)
    at yargs.parse (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/bin/cli.js:536:3)
    at Object.parse (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/node_modules/yargs/yargs.js:567:18)
    at /Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/bin/cli.js:219:8
    at Object.<anonymous> (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack-cli/bin/cli.js:538:3)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Module.require (internal/modules/cjs/loader.js:692:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at Object.<anonymous> (/Users/aubrey/Documents/Repos/SelfServiceApp2/node_modules/webpack/bin/webpack.js:156:2)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)
Executing webpack failed with exit code 1.

Here is my environment info:

package.json

{
    "nativescript": {
        "id": "org.nativescript.MyApp",
        "tns-ios": {
            "version": "6.5.2"
        },
        "tns-android": {
            "version": "6.5.3"
        }
    },
    "description": "NativeScript Application",
    "license": "SEE LICENSE IN <your-license-filename>",
    "repository": "<fill-your-repository-here>",
    "dependencies": {
        "@angular/animations": "~9.1.12",
        "@angular/common": "~9.1.12",
        "@angular/compiler": "~9.1.12",
        "@angular/compiler-cli": "~9.1.12",
        "@angular/core": "~9.1.12",
        "@angular/forms": "~9.1.12",
        "@angular/platform-browser": "~9.1.12",
        "@angular/platform-browser-dynamic": "~9.1.12",
        "@angular/router": "~9.1.12",
        "@danvick/ngx-translate-nativescript-loader": "^2.0.0",
        "@nativescript/angular": "^9.0.0",
        "@nativescript/core": "^6.5.18",
        "@nativescript/theme": "^2.2.1",
        "@ngx-translate/core": "^12.1.2",
        "@ngx-translate/http-loader": "^4.0.0",
        "@nstudio/nativescript-loading-indicator": "^3.0.3",
        "@schematics/angular": "^8.3.18",
        "autobind-decorator": "^2.4.0",
        "moment": "^2.24.0",
        "nativescript-appversion": "^1.4.4",
        "nativescript-feedback": "^1.3.12",
        "nativescript-inappbrowser": "^2.2.0",
        "nativescript-iqkeyboardmanager": "^1.5.1",
        "nativescript-store-update": "^1.0.2",
        "nativescript-theme-core": "~1.0.6",
        "nativescript-ui-dataform": "^6.1.0",
        "nativescript-ui-sidedrawer": "^9.0.3",
        "nativescript-unit-test-runner": "^0.7.0",
        "nativescript-urlhandler": "^1.3.0",
        "reflect-metadata": "~0.1.12",
        "rxjs": "^6.5.5",
        "tns-core-modules": "^6.4.1",
        "zone.js": "~0.10.3"
    },
    "devDependencies": {
        "@angular/cli": "^9.0.5",
        "@angular/compiler-cli": "~9.1.12",
        "@nativescript/schematics": "^1.0.0",
        "@ngtools/webpack": "^9.1.12",
        "@types/jasmine": "3.5.6",
        "@types/jest": "^24.0.20",
        "@types/mocha": "^5.2.7",
        "jasmine-marbles": "^0.6.0",
        "karma": "4.4.1",
        "karma-jasmine": "3.1.1",
        "karma-nativescript-launcher": "0.4.0",
        "karma-typescript": "^4.1.1",
        "karma-typescript-angular2-transform": "^4.1.1",
        "karma-webpack": "3.0.5",
        "nativescript-dev-webpack": "^1.5.1",
        "node-sass": "^4.12.0",
        "sass": "^1.23.7",
        "sass-loader": "^8.0.0",
        "terser-webpack-plugin": "^4.2.1",
        "tns-platform-declarations": "^6.4.1",
        "typescript": "~3.8.3",
        "webpack": "^4.44.1"
    },
    "peerDependencies": {
        "tslib": "1.10.0"
    },
    "gitHead": "1964ea9e8ca1a0518e0d6370781eedcf6c23db42",
    "readme": "NativeScript Application",
    "scripts": {
        "ngcc": "ngcc --properties es2015 module main --first-only",
        "postinstall": "npm run ngcc"
    }
}

ngcc.config.js


module.exports = {
    "packages": {
        "@nativescript/angular": {
            entryPoints: {
                ".": {
                    override: {
                        main: "./index.js",
                        typings: "./index.d.ts",
                    },
                    ignoreMissingDependencies: true,
                }
            },
            ignorableDeepImportMatchers: [
                /zone.js\//,
                /tns-core-modules\//,
                /@nativescript\/core\//
            ]
        },
        "nativescript-localize": {
            entryPoints: {
                ".": {
                    override: {
                        main: "./angular.js",
                        typings: "./angular.d.ts",
                    },
                    ignoreMissingDependencies: true,
                },
            },
            ignorableDeepImportMatchers: [
                /@nativescript\/core\//
            ]
        },
        "nativescript-datetimepicker": {
            entryPoints: {
                ".": {
                    override: {
                        main: "./index.js",
                        typings: "./index.d.ts",
                    },
                    ignoreMissingDependencies: true,
                },
                "angular": {
                    override: {
                        main: "./index.js",
                        typings: "./index.d.ts",
                    },
                    ignoreMissingDependencies: true,
                }
            },
            ignorableDeepImportMatchers: [
                /tns-core-modules\//,
                /@nativescript\/core\//,
                /@nativescript\/angular\//
            ]
        },
        "nativescript-ui-sidedrawer": {
            entryPoints: {
                "angular": {
                    override: {
                        main: "./side-drawer-directives.js",
                        typings: "./side-drawer-directives.d.ts",
                    },
                    ignoreMissingDependencies: true,
                }
            },
            ignorableDeepImportMatchers: [
                /tns-core-modules\//,
                /@nativescript\/core\//,
                /@nativescript\/angular\//
            ]
        },
        "nativescript-ui-listview": {
            entryPoints: {
                "angular": {
                    override: {
                        main: "./listview-directives.js",
                        typings: "./listview-directives.d.ts",
                    },
                    ignoreMissingDependencies: true,
                }
            },
            ignorableDeepImportMatchers: [
                /tns-core-modules\//,
                /@nativescript\/core\//,
                /@nativescript\/angular\//
            ]
        }
    }
}

tsconfig

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "noEmitHelpers": true,
        "noEmitOnError": true,
        "skipLibCheck": true,
        "lib": [
            "es2017",
            "es6",
            "dom",
            "es2018.promise"
        ],
        "baseUrl": ".",
        "paths": {
            "~/*": [
                "src/*"
            ]
        }
    },
    "angularCompilerOptions": {
        "enableIvy": true
    },
    "include": [
        "reference.d.ts"
    ],
    "files": [
        "./src/main.ts"
    ],
    "exclude": [
        "node_modules",
        "platforms",
        "**/*.aot",
        "e2e"
    ]
}

tsconfig.tns.json

{
    "extends": "./tsconfig",
    "compilerOptions": {
        "module": "ESNext",
        "moduleResolution": "node"
    }
}
fouladi1983 commented 3 years ago

@aquinn637 After upgrading to nativescript 7 the nativescript-side-drawer crashed cause the change of import in app.module file I changed the path from import 'nativescript-ui-sidedrawer/angular/side-drawer-directives' to 'nativescript-ui-sidedrawer/angular/nativescript-ui-sidedrawer-angular' and it fixed