Compiling my Angular Electron app gives Error: ENOENT: no such file or directory, open 'node_modules/@angular-devkit/build-angular/src/angular-cli-files/_models/webpack-configs/browser.js'. The app does compile and run. The problem emerged after running npm install.
My node-modules has ../angular-cli-files/models/.., containing browser.js. Weirdly, an underscore is prepended, ie _models, in the error message. I'm completely at a loss why this happens. I've tried the suggestions in several SO answers Could not find module "@angular-devkit/build-angular"; Cannot find module 'webpack' - Angular and others, but no luck. My search didn't find any examples with an underscore being prepended.
package.json:
{
"name": "five-x",
"version": "0.0.1",
"description": "FiveX Electron App",
"main": "main.js",
"private": true,
"scripts": {
"postinstall": "npm run postinstall:electron && electron-builder install-app-deps",
"postinstall:web": "node postinstall-web",
"postinstall:electron": "node postinstall",
"ng": "ng",
"start": "PORT=4201 npm run postinstall:electron && npm-run-all -p ng:serve electron:serve",
"start:dev": "npm run postinstall:electron && npm-run-all -p ng:serve electron:serve:dev",
"build": "npm run postinstall:electron && npm run electron:serve-tsc && ng build",
"build:dev": "npm run build -- -c dev",
"build:prod": "npm run build -- -c production",
"ng:serve": "ng serve",
"ng:serve:web": "npm run postinstall:web && ng serve -o",
"electron:serve-tsc": "tsc -p tsconfig-serve.json",
"electron:serve": "wait-on http-get://localhost:4201/ && npm run electron:serve-tsc && electron . --serve",
"electron:serve:dev": "wait-on http-get://localhost:4201/ && npm run electron:serve-tsc && electron . --serve --tools",
"electron:local": "npm run build:prod && electron .",
"electron:linux": "npm run build:prod && electron-builder build --linux",
"electron:windows": "npm run build:prod && electron-builder build --windows",
"electron:mac": "npm run build:prod && electron-builder build --mac",
"test": "npm run postinstall:web && ng test --no-watch --no-progress --source-map=false",
"test:watch": "npm run postinstall:web && ng test --watch --no-progress --source-map=false",
"e2e": "npm run postinstall:web && ng e2e",
"lint": "ng lint --format stylish --type-check",
"check-licenses": "license-checker --onlyAllow='MIT;ISC;BSD-2-Clause;BSD-3-Clause;Apache-2.0;LGPL;WTFPL;CC-BY-4.0;CC-BY-3.0;BSD;Public Domain;CC0-1.0;Unlicense;Zlib' --excludePackages '[email protected];[email protected];[email protected];@mapbox/[email protected];[email protected];[email protected];[email protected];[email protected];[email protected]'",
"check-format": "prettier --check 'src/**/*.{ts,scss,html}'",
"format": "prettier --write 'src/**/*.{ts,scss,html}'",
"license-report": "license-report --output=table --fields={name,licenseType,link}",
"dependency-graph": "ngd -d documentation/dependency-graph",
"compodoc": "npx compodoc -p src/tsconfig.app.json -d documentation/generated",
"docs": "npm run compodoc && open documentation/generated/index.html"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.803.19",
"@angular-devkit/build-ng-packagr": "~0.803.19",
"@angular/animations": "^8.2.14",
"@angular/cdk": "^8.2.3",
"@angular/cli": "^8.3.19",
"@angular/common": "^8.2.14",
"@angular/compiler": "^8.2.14",
"@angular/compiler-cli": "^8.2.14",
"@angular/core": "^8.2.14",
"@angular/forms": "^8.2.14",
"@angular/language-service": "^8.2.14",
"@angular/material": "^8.2.3",
"@angular/platform-browser": "^8.2.14",
"@angular/platform-browser-dynamic": "^8.2.14",
"@angular/router": "^8.2.14",
"@compodoc/compodoc": "^1.1.11",
"@compodoc/ngd-cli": "^2.0.0",
"@kiosk/store": "^1.0.3",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"@types/chartist": "^0.9.46",
"@types/jasmine": "^3.4.6",
"@types/jasminewd2": "^2.0.8",
"@types/node": "^12.12.9",
"@types/plotly.js": "^1.44.16",
"angular-plotly.js": "^1.4.2",
"chartist": "^0.11.4",
"chartist-plugin-axistitle": "^0.0.4",
"chartist-plugin-legend": "^0.6.2",
"codelyzer": "^5.2.0",
"conventional-changelog-cli": "^2.0.28",
"core-js": "^3.4.1",
"electron": "^7.1.1",
"electron-builder": "^21.2.0",
"electron-reload": "^1.5.0",
"hammerjs": "^2.0.8",
"jasmine-core": "^3.5.0",
"jasmine-spec-reporter": "^4.2.1",
"karma": "^4.4.1",
"karma-chrome-launcher": "^3.1.0",
"karma-coverage-istanbul-reporter": "^2.1.0",
"karma-jasmine": "^2.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"license-checker": "^25.0.1",
"license-report": "^3.0.0",
"ng-mocks": "^8.1.0",
"ng-packagr": "^5.7.1",
"ng2-nouislider": "^1.8.2",
"node-sass": "^4.13.0",
"nouislider": "^14.0.3",
"npm-run-all": "^4.1.5",
"plotly.js": "^1.51.1",
"prettier": "^1.19.1",
"protractor": "^5.4.2",
"python-shell": "^1.0.8",
"rxjs": "^6.5.3",
"ts-node": "^8.5.2",
"tsickle": "^0.37.1",
"tslint": "^5.20.1",
"typescript": "3.7.2",
"wait-on": "^3.3.0",
"webdriver-manager": "^12.1.7",
"zone.js": "~0.10.2"
},
"dependencies": {
"npm-check-updates": "^3.2.1",
"tslib": "^1.10.0"
}
}
angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"angular-electron": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
"stylePreprocessorOptions": {
"includePaths": [
"src/app",
"src/styles"
]
},
"assets": [
"src/assets",
"src/favicon.ico",
"src/favicon.png",
"src/favicon.icns",
"src/favicon.256x256.png",
"src/favicon.512x512.png"
],
"styles": [
"src/styles/global.scss"
],
"scripts": []
},
"configurations": {
"dev": {
"optimization": false,
"outputHashing": "all",
"sourceMap": true,
"extractCss": true,
"namedChunks": false,
"aot": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": false,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.dev.ts"
}
]
},
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "angular-electron:build",
"port": 4201
},
"configurations": {
"dev": {
"browserTarget": "angular-electron:build:dev"
},
"production": {
"browserTarget": "angular-electron:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "angular-electron:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills-test.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"scripts": [],
"styles": [
"src/styles/global.scss"
],
"stylePreprocessorOptions": {
"includePaths": [
"src/app",
"src/styles"
]
},
"assets": [
"src/assets",
"src/favicon.ico",
"src/favicon.png",
"src/favicon.icns",
"src/favicon.256x256.png",
"src/favicon.512x512.png"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
},
"angular-electron-e2e": {
"root": "e2e",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "angular-electron:serve"
}
}
}
},
"core-domain": {
"projectType": "library",
"root": "projects/core-domain",
"sourceRoot": "projects/core-domain/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-ng-packagr:build",
"options": {
"tsConfig": "projects/core-domain/tsconfig.lib.json",
"project": "projects/core-domain/ng-package.json"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "projects/core-domain/src/test.ts",
"tsConfig": "projects/core-domain/tsconfig.spec.json",
"karmaConfig": "projects/core-domain/karma.conf.js"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"projects/core-domain/tsconfig.lib.json",
"projects/core-domain/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}
},
"defaultProject": "angular-electron",
"schematics": {
"@schematics/angular:component": {
"prefix": "fx",
"styleext": "scss"
},
"@schematics/angular:directive": {
"prefix": "fx"
}
}
}
