angular / angular-cli

CLI tool for Angular
https://cli.angular.io
MIT License
26.74k stars 11.98k forks source link

Error while running ng build --prod Unexpected character '@' [node_modules/material-design-icons/iconfont/material-icons.css:1,0] #22410

Closed iharsh0088 closed 2 years ago

iharsh0088 commented 2 years ago

🐞 Bug report

Command (mark with an x)

Is this a regression?

Do not know

Description

When trying to run ng build --prod it is giving error.

πŸ”¬ Minimal Reproduction

package.json

{ "name": "app", "version": "1.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "~11.2.4", "@angular/cdk": "^11.2.13", "@angular/common": "~11.2.4", "@angular/compiler": "~11.2.4", "@angular/core": "~11.2.4", "@angular/forms": "~11.2.4", "@angular/material": "^11.2.13", "@angular/platform-browser": "~11.2.4", "@angular/platform-browser-dynamic": "~11.2.4", "@angular/router": "~11.2.4", "angular-gridster2": "^11.2.0", "d3": "^7.1.1", "material-design-icons": "^3.0.1", "ng-circle-progress": "^1.6.0", "rxjs": "~6.6.0", "toastr": "^2.1.4", "tslib": "^2.0.0", "videojs-offset": "^2.1.3", "videojs-youtube": "^2.6.1", "zone.js": "~0.11.3" }, "devDependencies": { "@angular-devkit/build-angular": "~0.1102.3", "@angular/cli": "~11.2.3", "@angular/compiler-cli": "~11.2.4", "@types/d3": "^7.0.0", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", "jasmine-spec-reporter": "~5.0.0", "karma": "~6.1.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.0.3", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.5.0", "protractor": "~7.0.0", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "~4.1.5" } }

angular.json

{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "app": { "projectType": "application", "schematics": { "@schematics/angular:application": { "strict": true } }, "root": "", "sourceRoot": "src", "prefix": "app", "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "dist/app", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.app.json", "aot": true, "assets": [ "src/favicon.ico", "src/assets" ], "styles": [ "./node_modules/video.js/dist/video-js.min.css", "./node_modules/material-design-icons/iconfont/material-icons.css", "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "src/styles.css" ], "scripts": [ "./node_modules/material-design-icons/iconfont/material-icons.css", "./node_modules/video.js/dist/video.min.js", "./node_modules/videojs-youtube/dist/Youtube.min.js", "./node_modules/videojs-offset/dist/videojs-offset.js", "./node_modules/toastr/toastr.js", "./node_modules/toastr/toastr.scss" ] }, "configurations": { "production": { "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ], "optimization": true, "outputHashing": "all", "sourceMap": false, "namedChunks": false, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, "budgets": [ { "type": "initial", "maximumWarning": "500kb", "maximumError": "1mb" }, { "type": "anyComponentStyle", "maximumWarning": "2kb", "maximumError": "4kb" } ] } } }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "app:build" }, "configurations": { "production": { "browserTarget": "app:build:production" } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { "browserTarget": "app:build" } }, "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "src/test.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.spec.json", "karmaConfig": "karma.conf.js", "assets": [ "src/favicon.ico", "src/assets" ], "styles": [ "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "src/styles.css" ], "scripts": [] } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": [ "tsconfig.app.json", "tsconfig.spec.json", "e2e/tsconfig.json" ], "exclude": [ "/node_modules/" ] } }, "e2e": { "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", "devServerTarget": "app:serve" }, "configurations": { "production": { "devServerTarget": "app:serve:production" } } } } } }, "defaultProject": "app" }

πŸ”₯ Exception or Error


$ ng build --prod --source-map
Warning: Support was requested for IE 9 & IE 10 in the project's browserslist configuration. These browsers are no longer officially supported with Angular v11 and higher.
For additional information: https://v10.angular.io/guide/deprecations#ie-9-10-and-mobile
βœ” Browser application bundle generation complete.

Unexpected character '@' [node_modules/material-design-icons/iconfont/material-icons.css:1,0][scripts.ddd1e2a85034a709d624.js:1,0]
    at js_error (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:546:11)
    at parse_error (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:682:9)
    at Object.next_token [as input] (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:1109:9)
    at peek (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:1244:56)
    at next (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:1249:24)
    at parse (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:1238:15)
    at minify (/mnt/h/dir/app/node_modules/terser/dist/bundle.min.js:26237:38)
    at minify (/mnt/h/dir/app/node_modules/terser-webpack-plugin/dist/minify.js:162:24)
    at Object.transform (/mnt/h/dir/app/node_modules/terser-webpack-plugin/dist/minify.js:175:10)
    at execFunction (/mnt/h/dir/app/node_modules/jest-worker/build/workers/processChild.js:145:17)

🌍 Your Environment




ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / β–³ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 11.2.3
Node: 10.24.1
OS: linux x64

Angular: 
... 
Ivy Workspace: 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1102.3 (cli-only)
@angular-devkit/core         11.2.3 (cli-only)
@angular-devkit/schematics   11.2.3 (cli-only)
@schematics/angular          11.2.3 (cli-only)
@schematics/update           0.1102.3 (cli-only)

Anything else relevant?

alan-agius4 commented 2 years ago

Looks like the problem is that you have added ./node_modules/material-design-icons/iconfont/material-icons.css as a script.

angular-automatic-lock-bot[bot] commented 2 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.