Browser folder error
alvarofelipe12 opened this issue · 1 comments
alvarofelipe12 commented
I received this error after building the app so I thought not creating the Jekyll would help...
It looks like it's been looking for a browser folder from previous angular versions all this time. On top of that, this is an updated project coming from version 10 to 17.
Is there any other configuration file related to this issue? I acknowledge that angular used to generate that folder, however, my config files don't have anything like it. At the moment I'm sharing the package.json and the angular.json
package.json
{
"name": "covid19-quindio",
"version": "0.0.0",
"scripts": {
"cy:open": "cypress open",
"cy:run": "cypress run",
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"deploy": "ng deploy covid19-quindio --base-href=/"
},
"private": true,
"dependencies": {
"@angular/animations": "^17.2.1",
"@angular/common": "^17.2.1",
"@angular/compiler": "^17.2.1",
"@angular/core": "^17.2.1",
"@angular/forms": "^17.2.1",
"@angular/platform-browser": "^17.2.1",
"@angular/platform-browser-dynamic": "^17.2.1",
"@angular/router": "^17.2.1",
"@fortawesome/angular-fontawesome": "^0.10.0",
"@fortawesome/fontawesome-svg-core": "^1.2.28",
"@fortawesome/free-solid-svg-icons": "^5.13.0",
"bootstrap": ">=4.3.1",
"jquery": "^3.5.1",
"ngx-bootstrap": "^6.1.0",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.14.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "^17.2.0",
"@angular/cli": "^17.2.0",
"@angular/compiler-cli": "^17.2.1",
"@briebug/cypress-schematic": "^4.2.0",
"@cypress/webpack-preprocessor": "5.4.6",
"@types/jasmine": "~3.8.0",
"@types/jasminewd2": "~2.0.3",
"@types/jquery": "^3.5.4",
"@types/node": "^12.11.1",
"angular-cli-ghpages": "^2.0.0-beta.1",
"codelyzer": "^6.0.0",
"cypress": "5.3.0",
"jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.4.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.7.0",
"ts-loader": "8.0.5",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~5.3.3"
},
"resolutions": {
"webpack": "^5.0.0"
}
}
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"covid19-quindio": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/covid19-quindio",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": ["zone.js"],
"tsConfig": "tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"./node_modules/ngx-bootstrap/datepicker/bs-datepicker.css",
"src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": {
"scripts": true,
"styles": {
"minify": true,
"inlineCritical": false
},
"fonts": true
},
"outputHashing": "all",
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
},
"defaultConfiguration": ""
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"buildTarget": "covid19-quindio:build"
},
"configurations": {
"production": {
"buildTarget": "covid19-quindio:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"buildTarget": "covid19-quindio:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": [
"zone.js",
"zone.js/testing"
],
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"./node_modules/ngx-bootstrap/datepicker/bs-datepicker.css",
"src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"cypress/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@briebug/cypress-schematic:cypress",
"options": {
"devServerTarget": "covid19-quindio:serve",
"watch": true,
"headless": false
},
"configurations": {
"production": {
"devServerTarget": "covid19-quindio:serve:production"
}
}
},
"cypress-run": {
"builder": "@briebug/cypress-schematic:cypress",
"options": {
"devServerTarget": "covid19-quindio:serve"
},
"configurations": {
"production": {
"devServerTarget": "covid19-quindio:serve:production"
}
}
},
"cypress-open": {
"builder": "@briebug/cypress-schematic:cypress",
"options": {
"devServerTarget": "covid19-quindio:serve",
"watch": true,
"headless": false
},
"configurations": {
"production": {
"devServerTarget": "covid19-quindio:serve:production"
}
}
},
"deploy": {
"builder": "angular-cli-ghpages:deploy",
"options": {}
}
}
}
},
"cli": {
"analytics": false
}
}
fmalcher commented
The browser folder is actually generated by the new ESBuild-based application builder which is the default in newly created Angular projects.
There are two possible solutions for your problem:
- Use the new
applicationbuilder. See the guide, there is also an automatic migration schematic: https://angular.io/guide/esbuild - Stay with the older
browserbuilder and specify the directory manually with thedirargument. You can either set it via command line or in the builder options in yourangular.jsonfile:
"options": {
"dir": "dist/covid19-quindio"
}