如何解决由于不允许的 MIME 类型“application/json”
我已经在我的项目中实现了 Angular Universal，我希望将它部署到 AWS 中的无服务器环境，但是当我在本地运行应用程序时，我遇到了以下错误。
我按照下面的链接来实现 Angular Universal
https://medium.com/cactus-techblog/deploy-angular-universal-on-aws-lambda-from-scratch-1b169289eac2
index.html
<!doctype html>
<html lang="en">
<head>
<Meta charset="utf-8">
<title>CodetoSolutions</title>
<base href="/">
<Meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json","version": 1,"newProjectRoot": "projects","projects": {
"BlogApp": {
"projectType": "application","schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},"root": "","sourceRoot": "src","prefix": "app","architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser","options": {
"outputPath": "dist/BlogApp/browser","index": "src/index.html","main": "src/main.ts","polyfills": "src/polyfills.ts","tsConfig": "tsconfig.app.json","aot": false,"assets": [
"src/favicon.ico","src/assets","src/sitemap.xml","src/robots.txt"
],"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css","node_modules/font-awesome/css/font-awesome.min.css","src/styles.scss"
],"scripts": ["./node_modules/jquery/dist/jquery.min.js","node_modules/bootstrap/dist/js/bootstrap.min.js"
]
},"configurations": {
"production": {
"fileReplacements": [{
"replace": "src/environments/environment.ts","with": "src/environments/environment.prod.ts"
}],"optimization": true,"outputHashing": "all","sourceMap": false,"extractCss": true,"namedChunks": false,"extractLicenses": true,"vendorChunk": false,"buildOptimizer": false,"budgets": [{
"type": "initial","maximumWarning": "2mb","maximumError": "5mb"
},{
"type": "anyComponentStyle","maximumWarning": "6kb","maximumError": "10kb"
}
]
}
}
},"serve": {
"builder": "@angular-devkit/build-angular:dev-server","options": {
"browserTarget": "BlogApp:build"
},"configurations": {
"production": {
"browserTarget": "BlogApp:build:production"
}
}
},"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n","options": {
"browserTarget": "BlogApp:build"
}
},"test": {
"builder": "@angular-devkit/build-angular:karma","options": {
"main": "src/test.ts","tsConfig": "tsconfig.spec.json","karmaConfig": "karma.conf.js","styles": [
"src/styles.scss"
],"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": "BlogApp:serve"
},"configurations": {
"production": {
"devServerTarget": "BlogApp:serve:production"
}
}
},"serverless": {
"builder": "@angular-devkit/build-angular:server","options": {
"outputPath": "dist/BlogApp/serverless","main": "serverless.ts","tsConfig": "tsconfig.serverless.json"
},"configurations": {
"production": {
"outputHashing": "media","fileReplacements": [
{
"replace": "src/environments/environment.ts","with": "src/environments/environment.prod.ts"
}
],"optimization": false
}
}
},"server": {
"builder": "@angular-devkit/build-angular:server","options": {
"outputPath": "dist/BlogApp/server","main": "server.ts","tsConfig": "tsconfig.server.json"
},"configurations": {
"production": {
"outputHashing": "media","fileReplacements": [
{
"replace": "src/environments/environment.ts","with": "src/environments/environment.prod.ts"
}
],"optimization": true
}
}
},"serve-ssr": {
"builder": "@nguniversal/builders:ssr-dev-server","options": {
"browserTarget": "BlogApp:build","serverTarget": "BlogApp:server"
},"configurations": {
"production": {
"browserTarget": "BlogApp:build:production","serverTarget": "BlogApp:server:production"
}
}
},"prerender": {
"builder": "@nguniversal/builders:prerender","options": {
"browserTarget": "BlogApp:build:production","serverTarget": "BlogApp:server:production","routes": [
"/"
]
},"configurations": {
"production": {}
}
}
}
}
},"defaultProject": "BlogApp"
}
package.json
{
"name": "BlogApp","version": "0.0.0","scripts": {
"ng": "ng","start": "ng serve","build": "ng build","test": "ng test","lint": "ng lint","e2e": "ng e2e","dev:ssr": "ng run BlogApp:serve-ssr","serve:ssr": "node dist/BlogApp/server/main.js","build:ssr": "ng build --prod && ng run BlogApp:server:production","prerender": "ng run BlogApp:prerender","serve:sls": "serverless offline start","build:sls": "ng build --prod && ng run BlogApp:serverless:production","deploy": "serverless deploy","terminate": "serverless remove","build:serverless:deploy": "npm run build:sls && npm run deploy"
},"private": true,"dependencies": {
"@angular/animations": "~9.1.6","@angular/common": "~9.1.6","@angular/compiler": "~9.1.6","@angular/core": "~9.1.6","@angular/forms": "~9.1.6","@angular/platform-browser": "~9.1.6","@angular/platform-browser-dynamic": "~9.1.6","@angular/platform-server": "~9.1.6","@angular/router": "~9.1.6","@syncfusion/ej2-angular-richtexteditor": "^18.2.56","aws-sdk": "^2.797.0","aws-serverless-express": "^3.4.0","@vendia/serverless-express": "^4.3.4","bootstrap": "^3.3.7","express": "^4.15.2","font-awesome": "^4.7.0","jquery": "^3.5.1","ng-lazyload-image": "^9.1.0","ngx-spinner": "^10.0.1","rxjs": "~6.5.4","tslib": "^1.10.0","web-animations-js": "^2.3.2","zone.js": "~0.10.2"
},"devDependencies": {
"@angular-devkit/build-angular": "~0.901.5","@angular/cli": "~9.1.5","@angular/compiler-cli": "~9.1.6","@nguniversal/builders": "^9.1.1","@nguniversal/express-engine": "^9.1.1","@types/express": "^4.17.0","@types/jasmine": "~3.5.0","@types/jasminewd2": "~2.0.3","@types/node": "^12.19.6","codelyzer": "^5.1.2","jasmine-core": "~3.5.0","jasmine-spec-reporter": "~4.2.1","karma": "~5.0.0","karma-chrome-launcher": "~3.1.0","karma-coverage-istanbul-reporter": "~2.1.0","karma-jasmine": "~3.0.1","karma-jasmine-html-reporter": "^1.4.2","protractor": "~5.4.3","serverless": "^2.30.2","serverless-apigw-binary": "^0.4.4","serverless-offline": "^6.8.0","ts-node": "~8.3.0","tslint": "~6.1.0","typescript": "~3.8.3"
}
}
我正在运行以下命令以在本地运行应用程序
npm run build:sls && npm run serve:sls
解决方法
这是通过更改 package.json 文件中的 serve:sls 脚本解决的 无服务器离线启动 --noPrependStageInUrl
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
