firebase.json
文件,包含以下内容:{
"hosting": {
"public": "dist/browser",
"rewrites": [{
"source": "**",
"function": "universal"
}]
},
"functions": {
"source": "dist/server",
"predeploy": [
"npm --prefix \"$RESOURCE_DIR\" run build",
"npm --prefix \"$RESOURCE_DIR\" run compile"
],
"deploy": {
"memory": "1GB",
"timeout": "60s"
}
},
"emulators": {
"functions": {
"port": 5001
},
"hosting": {
"port": 5000
}
}
}
tsconfig.server.json
文件,包含以下内容:{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "./out-tsc/server",
"baseUrl": "./",
"module": "commonjs",
"types": []
},
"exclude": [
"src/test.ts",
"**/*.spec.ts"
],
"angularCompilerOptions": {
"entryModule": "./src/app/app.server.module#AppServerModule"
}
}
package.json
的scripts中添加以下内容:"serve:universal": "firebase serve --only functions,hosting",
"build:universal": "npm run build:client-and-server-bundles && npm run compile:server",
"build:client-and-server-bundles": "ng build --prod && ng run myapp:server:production",
"compile:server": "tsc -p server.tsconfig.json",
"deploy:universal": "firebase deploy --only functions,hosting"
npm install firebase-tools --save-dev
npm install -g firebase-tools
在Firebase控制台中创建一个项目。
允许Firestore和Functions服务。
使用以下命令将本地项目与云端项目进行连接:
firebase login
firebase init
依次选择 Hosting, Functions 和 Firestore, 输入相关配置信息。
将 app.server.module
文件内容修改为:
import { NgModule } from '@angular/core';
import { ServerModule } from '@angular/platform-server';
import { ModuleMapLoaderModule } from '@nguniversal/module-map-ngfactory-loader';
import { AppModule } from './app.module';
import { AppComponent } from './