npm packagr won't pack assets folder - node.js

OS: Windows 10
Using Angular-CLI
My end goal is to have a package set up that contains the following file structure within the dist folder after runing npm run packagr:
+--src
| +-- app
| +-- assets
I have done the following set in angular-cli.json according to the documentation:
"apps" : [
{
"root": "src",
"outDir": "dist",
"assets": [
{
"glob": "**/*",
"input": "../styles",
"output" : "./assets/styles"
}
], ...
}, ...
]
According to the documentation this should target the assets/styles folder inside of my src directory, grab everything in it, then send it to dist as a copy. It will not do that, and I have done many iterations of this. All I want is my styles folder inside the dist directory, so when I run npm pack it is in the package and ready for upload.
package.json
{
"name": "c2c-component-library",
"version": "0.0.3",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"packagr": "ng-packagr -p ng-package.json"
},
"private": false,
"dependencies": {
"#angular/animations": "^5.2.0",
"#angular/common": "^5.2.0",
"#angular/compiler": "^5.2.0",
"#angular/core": "^5.2.0",
"#angular/forms": "^5.2.0",
"#angular/http": "^5.2.0",
"#angular/platform-browser": "^5.2.0",
"#angular/platform-browser-dynamic": "^5.2.0",
"#angular/router": "^5.2.0",
"bootstrap": "^4.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.5.6",
"zone.js": "^0.8.19"
},
"devDependencies": {
"#angular/cli": "1.6.8",
"#angular/compiler-cli": "^5.2.0",
"#angular/language-service": "^5.2.0",
"#types/jasmine": "~2.8.3",
"#types/jasminewd2": "~2.0.2",
"#types/node": "~6.0.60",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"ng-packagr": "^2.0.0",
"protractor": "~5.1.2",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "~2.5.3"
}
}

Related

ERROR in The Angular Compiler requires TypeScript >=3.1.1 and <3.3.0 but 3.9.10 was found instead

ERROR in The Angular Compiler requires TypeScript >=3.1.1 and <3.3.0 but 3.9.10 was found instead.
I am using
{
"name": "testUI",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"prod": "ng build --prod --build-optimizer",
"test": "ng test",
"lint": "ng lint > lintError.txt",
"e2e": "ng e2e",
"cli": "npm install --save #angular/cli#latest",
"whitesource": "whitesource run"
},
"private": true,
"dependencies": {
"#angular/animations": "^6.0.7",
"#angular/cdk": "^6.4.6",
"#angular/common": "^6.0.7",
"#angular/compiler": "^7.2.12",
"#angular/core": "^7.0.2",
"#angular/forms": "^6.0.7",
"#angular/http": "^6.0.7",
"#angular/material": "^6.4.6",
"#angular/platform-browser": "^6.0.7",
"#angular/platform-browser-dynamic": "^6.0.7",
"#angular/router": "^6.0.7",
"#ngx-translate/core": "^11.0.0",
"#ngx-translate/http-loader": "^3.0.1",
"angular2-busy": "^2.0.4",
"angular5-csv": "^0.2.11",
"chart.js": "2.9.4",
"core-js": "^2.5.7",
"date-and-time": "^0.14.2",
"hammerjs": "^2.0.8",
"primeicons": "^1.0.0-beta.10",
"primeng": "^6.1.5",
"rxjs": "6.3.3",
"zone.js": "^0.8.27"
},
"devDependencies": {
"#angular-devkit/build-angular": "~0.6.8",
"#angular/cli": "^7.1.4",
"#angular/compiler-cli": "^7.2.12",
"#angular/language-service": "^6.0.7",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "^8.9.5",
"codelyzer": "~4.2.1",
"jasmine": "^3.2.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-firefox-launcher": "^1.1.0",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.3.2",
"rxjs-compat": "^6.2.1",
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"typescript": "^3.2.0"
}
My angular core version was 6 I want to upgrade to 7. So i updated few components like core, compiler to version 7. and I am facing this issue for TypeScript. I am giving typescript version as 3.2.0 but in my package-lock.json it is coming as 3.9.10.

Ng serve is working but ionic serve is failing

I'm building an app using Ionic 6.19.0 and it suddenly started to face building issues.
I get Error: spawn UNKNOWN each time I execute ionic serve.
This is my package.json file
{
"name": "stile",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "https://ionicframework.com/",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular-devkit/schematics": "^13.3.3",
"#angular/common": "~13.0.0",
"#angular/core": "~13.0.0",
"#angular/forms": "~13.0.0",
"#angular/platform-browser": "~13.0.0",
"#angular/platform-browser-dynamic": "~13.0.0",
"#angular/router": "~13.0.0",
"#auth0/angular-jwt": "^5.0.2",
"#capacitor/android": "3.4.3",
"#capacitor/app": "1.1.0",
"#capacitor/camera": "^1.3.1",
"#capacitor/core": "3.4.0",
"#capacitor/haptics": "1.1.4",
"#capacitor/keyboard": "1.2.1",
"#capacitor/status-bar": "1.0.7",
"#ionic/angular": "^6.0.0",
"#npmcli/node-gyp": "^2.0.0",
"bootstrap": "^5.1.3",
"install": "^0.13.0",
"jquery": "^3.6.0",
"json-server": "^0.17.0",
"node-sass": "^7.0.1",
"npm": "^8.6.0",
"rxjs": "~6.6.0",
"tslib": "^2.3.1",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "^13.3.3",
"#angular-eslint/builder": "^12.2.1",
"#angular-eslint/eslint-plugin": "~13.0.1",
"#angular-eslint/eslint-plugin-template": "~13.0.1",
"#angular-eslint/template-parser": "~13.0.1",
"#angular/cli": "~13.0.1",
"#angular/compiler": "~13.0.0",
"#angular/compiler-cli": "~13.0.0",
"#angular/language-service": "~13.0.0",
"#capacitor/cli": "3.4.0",
"#ionic/angular-toolkit": "^6.1.0",
"#popperjs/core": "^2.11.5",
"#types/jasmine": "~3.6.0",
"#types/jasminewd2": "~2.0.3",
"#types/node": "^12.11.1",
"#typescript-eslint/eslint-plugin": "5.3.0",
"#typescript-eslint/parser": "5.3.0",
"acorn": "^8.7.0",
"ajv": "^6.12.6",
"eslint": "^7.6.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
"jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"typescript": "~4.4.4"
},
"description": "An Ionic project"
}
Here are few solutions that might help:
Ensure you're in the root folder of your project.
Try fixing the existing node_modules folder with npm rebuild + reassign
permissions to your node_modules folder: chmod 755 -R
/path/to/node_modules
Remove node_modules and reinstall with npm install

build issue with angular project

I have a angular ( 9 ) project.
node --version : v12.16.1
npm --version : 6.14.5
When I try to build using "npm install" i get error
Schema validation failed with the following errors:
Data path ".builders['app-shell']" should have required property 'class'.
The package.json file is given here
{
"name": "my-app",
"version": "1.1.1",
"scripts": {
"ng": "ng",
"start:dev": "ng serve --configuration=dev",
"start": "node server.js",
"build": "ng build --aot --prod --configuration=production",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"postinstall": "npm run build"
},
"private": true,
"dependencies": {
"#angular/animations": "^7.2.4",
"#angular/cdk": "~7.3.2",
"#angular/cli": "^7.3.1",
"#angular/common": "~7.2.0",
"#angular/compiler": "~7.2.0",
"#angular/core": "~7.2.0",
"#angular/forms": "~7.2.0",
"#angular/material": "^7.3.2",
"#angular/platform-browser": "~7.2.0",
"#angular/platform-browser-dynamic": "~7.2.0",
"#angular/router": "~7.2.0",
"#types/chart.js": "^2.7.45",
"angular4-hal": "^7.8.2",
"chart.js": "^2.7.3",
"core-js": "^2.5.4",
"express": "^4.16.4",
"hammerjs": "^2.0.8",
"moment": "^2.24.0",
"ngx-json-viewer": "^2.4.0",
"path": "^0.12.7",
"primeflex": "^1.0.0-rc.1",
"primeicons": "^1.0.0",
"primeng": "^7.1.0",
"rxjs": "~6.3.3",
"tslib": "^1.9.0",
"typescript": "~3.2.2",
"zone.js": "~0.8.26"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.901.1",
"#angular/compiler-cli": "^9.1.1",
"#angular/language-service": "~7.2.0",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "^8.9.5",
"codelyzer": "~4.5.0",
"enhanced-resolve": "^3.3.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^5.0.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0"
},
"engines": {
"node": "8.11.3",
"npm": "6.8.0"
}
}

Error: Project 'server.js' does not support the 'serve' target

I am a beginner to the MEAN stack framework. I am trying to run a node js server, using "nodemon server.js" command. But I get this error. I am trying to figure out why
Angular CLI: 9.1.3
Node: 12.4.0
Angular: 9.1.3
This is my package.json file
{
"name": "Angular-App",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"start:server": "nodemon server.js"
},
"private": true,
"dependencies": {
"#angular/animations": "^9.1.3",
"#angular/common": "^9.1.3",
"#angular/compiler": "^9.1.3",
"#angular/core": "^9.1.3",
"#angular/fire": "^6.0.0",
"#angular/forms": "^9.1.3",
"#angular/platform-browser": "^9.1.3",
"#angular/platform-browser-dynamic": "^9.1.3",
"#angular/router": "^9.1.3",
"bootstrap": "^4.4.1",
"core-js": "^3.6.5",
"express": "^4.17.1",
"firebase": "^7.14.2",
"jquery": "^3.5.0",
"ngx-bootstrap": "^5.6.1",
"rxjs": "~6.5.5",
"tslib": "^1.10.0",
"zone.js": "~0.10.3"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.901.3",
"#angular/cli": "^9.1.3",
"#angular/compiler-cli": "^9.1.3",
"#angular/language-service": "^9.1.3",
"#types/jasmine": "~3.3.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"nodemon": "^2.0.3",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "^3.8.3"
}
}
These are my versions
Please help, I am stuck in my project here

Angular 5 - When tried to access http://localhost:4200 in browser It shows "cannot GET / "

These are the steps I've followed:
1. Installed Node Js
2. npm install -g #angular/cli
3. In F:/Angular -> ng new hellowworldapp
4. In F:/Angular/hellowworldapp -> ng serve
When I open http://localhost:4200/ I'm getting this error in the browser:
Cannot GET /**
Then I've tried to uninstall and reinstall but I still have no clue what's happening.
Thanks in advance.
View Compile success Screenshot here
My package.json file is:
{
"name": "hellowworldapp",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^6.0.0-rc.1",
"#angular/common": "^6.0.0-rc.1",
"#angular/compiler": "^6.0.0-rc.1",
"#angular/core": "^6.0.0-rc.1",
"#angular/forms": "^6.0.0-rc.1",
"#angular/http": "^6.0.0-rc.1",
"#angular/platform-browser": "^6.0.0-rc.1",
"#angular/platform-browser-dynamic": "^6.0.0-rc.1",
"#angular/router": "^6.0.0-rc.1",
"core-js": "^2.5.4",
"rxjs": "^6.0.0-rc.0",
"zone.js": "^0.8.24"
},
"devDependencies": {
"#angular/compiler-cli": "^6.0.0-rc.1",
"#angular-devkit/build-angular": "~0.5.0",
"typescript": "~2.7.2",
"#angular/cli": "~6.0.0-rc.4",
"#angular/language-service": "^6.0.0-rc.1",
"#types/jasmine": "~2.8.6",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~1.4.2",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.3.0",
"ts-node": "~5.0.1",
"tslint": "~5.9.1"
}
}

Resources