I am a newbie to Angular (2 months experience). I inherited an Angular project using version 6 and Creative Tim template. I updated the @angular/cli from version 6 to 8.3.6. The CLI was updated successfully according to the "ng update" command. However, when I execute the "ng serve -o", I received all kind of errors.
I am not sure what I am missing that keeps my application from building successfully. Can you help?
I have tried "ng update -all --force" to make sure all the dependencies are up-to-date.
Here is my updated package.json
{
"name": "aac-bc-webui",
"version": "0.2.5",
"scripts": {
"ng": "ng",
"start": "ng serve -o --base-href /BusinessContinuity/",
"build": "ng build --base-href /BusinessContinuity/",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@adactive/bootstrap-tagsinput": "0.8.2",
"@agm/core": "1.0.0",
"@angular-devkit/build-angular": "^0.803.6",
"@angular/animations": "8.2.8",
"@angular/common": "8.2.8",
"@angular/compiler": "8.2.8",
"@angular/core": "8.2.8",
"@angular/forms": "8.2.8",
"@angular/http": "7.2.15",
"@angular/platform-browser": "8.2.8",
"@angular/platform-browser-dynamic": "8.2.8",
"@angular/router": "8.2.8",
"@fortawesome/angular-fontawesome": "^0.5.0",
"@fortawesome/fontawesome-svg-core": "^1.2.25",
"@fortawesome/free-brands-svg-icons": "^5.11.2",
"@fortawesome/free-regular-svg-icons": "^5.11.2",
"@fortawesome/free-solid-svg-icons": "^5.11.2",
"@ng-bootstrap/ng-bootstrap": "^5.1.1",
"@ngui/map": "0.30.3",
"@types/googlemaps": "3.37.7",
"ajv": "6.10.2",
"bootstrap": "^4.3.1",
"bootstrap-notify": "3.1.3",
"bootstrap-select": "1.13.11",
"bootstrap-tagsinput": "0.7.1",
"chart.js": "2.8.0",
"chartist": "0.11.4",
"chartist-plugin-zoom": "0.5.1",
"chartjs-plugin-zoom": "0.7.4",
"core-js": "3.2.1",
"datatables": "1.10.18",
"datatables.net": "^1.10.19",
"datatables.net-bs": "1.10.19",
"datatables.net-bs4": "^1.10.19",
"datatables.net-colreorder": "^1.5.1",
"datatables.net-colreorder-bs4": "^1.5.1",
"datatables.net-fixedcolumns": "^3.2.6",
"datatables.net-fixedcolumns-bs4": "^3.2.6",
"datatables.net-fixedheader-bs4": "^3.1.5",
"datatables.net-responsive": "2.2.3",
"datatables.net-responsive-bs4": "^2.2.3",
"datatables.net-rowgroup-bs4": "^1.0.3",
"datatables.net-scroller-bs4": "^2.0.0",
"datatables.net-select-bs4": "^1.3.0",
"easy-pie-chart": "2.1.7",
"eonasdan-bootstrap-datetimepicker": "4.17.47",
"font-awesome": "^4.7.0",
"fullcalendar": "3.10.1",
"ionicons": "^4.6.3",
"jasny-bootstrap": "4.0.0",
"jquery": "^3.4.1",
"jvectormap": "2.0.4",
"jw-bootstrap-switch-ng2": "^2.0.5",
"ngx-chips": "^2.0.2",
"ngx-toastr": "^11.0.0",
"nouislider": "14.0.2",
"npm": "^6.11.3",
"perfect-scrollbar": "^1.4.0",
"popper.js": "1.15.0",
"rxjs": "6.5.3",
"rxjs-compat": "6.5.3",
"sweetalert2": "8.17.6",
"twitter-bootstrap-wizard": "1.2.0",
"web-animations-js": "2.3.2",
"zone.js": "0.10.2"
},
"devDependencies": {
"@angular/cli": "^8.3.6",
"@angular/compiler-cli": "8.2.8",
"@types/bootstrap": "4.3.1",
"@types/chartist": "0.9.46",
"@types/jasmine": "3.4.1",
"@types/jquery": "3.3.31",
"@types/node": "12.7.8",
"codelyzer": "5.1.2",
"jasmine-core": "3.5.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "4.3.0",
"karma-chrome-launcher": "3.1.0",
"karma-cli": "2.0.0",
"karma-coverage-istanbul-reporter": "2.1.0",
"karma-jasmine": "2.0.1",
"karma-jasmine-html-reporter": "1.4.2",
"protractor": "5.4.2",
"ts-node": "8.4.1",
"tslint": "5.20.0",
"typescript": "^3.6.3"
}
}
Here is the error:
ERROR in ./src/assets/scss/paper-dashboard.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--15-3!./src/assets/scss/paper-dashboard.scss)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
&::-moz-placeholder {@content; } // Firefox
^
Top-level selectors may not contain the parent selector "&".
╷
25 │ &::-moz-placeholder {@content; } // Firefox
│ ^^^^^^^^^^^^^^^^^^^^
╵
src\assets\scss\paper-dashboard\mixins\_inputs.scss 25:3 placeholder()
src\assets\scss\paper-dashboard\_inputs.scss 1:1 @import
stdin 40:9 root stylesheet
in C:\LocalDev\Repo\AAC.BC.WebUI\src\assets\scss\paper-dashboard\mixins\_inputs.scss (line 25, column 3)
ERROR in The Angular Compiler requires TypeScript >=3.4.0 and <3.6.0 but 3.6.3 was found instead.
