angular - Angular + Nestjs 部署
问题描述
我正在尝试使用nestjs 和angular 开发一个项目。我的项目文件夹是这样的，
项目文件夹
|--服务器（Nestjs 应用）
---|客户端（Angular 应用程序）
---|---前面
我可以在本地主机上运行这个应用程序就好了。但我正在尝试部署到heroku。我构建了 Angular 应用程序并将这些文件复制到名为 front 的文件夹中。然后我将把这个文件夹拖到服务器文件夹中。
在 nestjs app 的 app.module.ts 文件中：
@Module({
imports: [UserModule,
TaskModule,
MongooseModule.forRoot(secret.mongoUrl),
LoginModule,
SignUpModule,
ServeStaticModule.forRoot({
rootPath: join(__dirname, '..', 'front')
})
],
controllers: [AppController],
providers: [AppService],
})
现在，当我用 npm 启动我的 nestjsapp 时，我的 angular 和 nestjs 应用程序在 localhost:3000 上完美运行。
这是我的heroku构建日志，
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NPM_CONFIG_PRODUCTION=false
NODE_ENV=production
NODE_MODULES_CACHE=true
NODE_VERBOSE=false
-----> Installing binaries
engines.node (package.json): unspecified
engines.npm (package.json): unspecified (use default)
Resolving node version 12.x...
Downloading and installing node 12.18.3...
Using default npm version: 6.14.6
-----> Installing dependencies
Installing node modules (package.json + package-lock)
> bcrypt@5.0.0 install /tmp/build_742df812/node_modules/bcrypt
> node-pre-gyp install --fallback-to-build
[bcrypt] Success: "/tmp/build_742df812/node_modules/bcrypt/lib/binding/napi-v3/bcrypt_lib.node" is installed via remote
> @nestjs/core@7.3.2 postinstall /tmp/build_742df812/node_modules/@nestjs/core
> opencollective || exit 0
> server@0.0.1 postinstall /tmp/build_742df812
> nest build
client/e2e/src/app.po.ts:1:38 - error TS2307: Cannot find module 'protractor' or its corresponding type declarations.
1 import { browser, by, element } from 'protractor';
~~~~~~~~~~~~
client/src/app/add-task/add-task.component.ts:2:39 - error TS2307: Cannot find module '@angular/forms' or its corresponding type declarations.
2 import { FormControl,FormGroup } from '@angular/forms';
~~~~~~~~~~~~~~~~
client/src/app/add-task/add-task.component.ts:3:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
3 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/app-routing.module.ts:7:26 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
7 import { NgModule } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/app-routing.module.ts:8:51 - error TS2307: Cannot find module '@angular/router' or its corresponding type declarations.
8 import { Routes, RouterModule, CanActivate } from '@angular/router';
~~~~~~~~~~~~~~~~~
client/src/app/app.component.ts:1:27 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
1 import { Component } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/app.module.ts:2:47 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
2 import { HttpClient, HTTP_INTERCEPTORS } from '@angular/common/http';
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/app.module.ts:3:30 - error TS2307: Cannot find module '@angular/router' or its corresponding type declarations.
3 import { RouterModule } from '@angular/router';
~~~~~~~~~~~~~~~~~
client/src/app/app.module.ts:4:31 - error TS2307: Cannot find module '@angular/platform-browser' or its corresponding type declarations.
4 import { BrowserModule } from '@angular/platform-browser';
~~~~~~~~~~~~~~~~~~~~~~~~~~~
client/src/app/app.module.ts:5:26 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
5 import { NgModule } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/app.module.ts:6:33 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
6 import {HttpClientModule } from '@angular/common/http'
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/app.module.ts:13:49 - error TS2307: Cannot find module '@angular/forms' or its corresponding type declarations.
13 import { FormsModule,ReactiveFormsModule } from '@angular/forms';
~~~~~~~~~~~~~~~~
client/src/app/guards/auth.guard.ts:2:28 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
2 import { Injectable } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/guards/auth.guard.ts:3:83 - error TS2307: Cannot find module '@angular/router' or its corresponding type declarations.
3 import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree } from '@angular/router';
~~~~~~~~~~~~~~~~~
client/src/app/home-page/home-page.component.ts:4:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
4 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/login/login.component.ts:2:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
2 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/login/login.component.ts:3:39 - error TS2307: Cannot find module '@angular/forms' or its corresponding type declarations.
3 import { FormGroup,FormControl } from '@angular/forms';
~~~~~~~~~~~~~~~~
client/src/app/nav-bar/nav-bar.component.ts:1:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
1 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/services/auth.service.ts:2:34 - error TS2307: Cannot find module '@auth0/angular-jwt' or its corresponding type declarations.
2 import { JwtHelperService } from '@auth0/angular-jwt';
~~~~~~~~~~~~~~~~~~~~
client/src/app/services/auth.service.ts:3:28 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
3 import { Injectable } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/services/auth.service.ts:4:28 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
4 import { HttpClient } from '@angular/common/http';
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/services/auth.service.ts:5:24 - error TS2307: Cannot find module '@angular/router' or its corresponding type declarations.
5 import { Router } from '@angular/router';
~~~~~~~~~~~~~~~~~
client/src/app/services/task.service.ts:3:28 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
3 import { HttpClient } from '@angular/common/http';
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/services/task.service.ts:4:28 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
4 import { Injectable } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/services/token.interceptor.ts:2:28 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
2 import { Injectable } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/services/token.interceptor.ts:8:8 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
8 } from '@angular/common/http';
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/services/user.service.ts:4:28 - error TS2307: Cannot find module '@angular/common/http' or its corresponding type declarations.
4 import { HttpClient } from '@angular/common/http';
~~~~~~~~~~~~~~~~~~~~~~
client/src/app/services/user.service.ts:5:28 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
5 import { Injectable } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/show-task/show-task.component.ts:2:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
2 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/show-task/show-task.component.ts:3:30 - error TS2307: Cannot find module '@angular/router' or its corresponding type declarations.
3 import {ActivatedRoute} from '@angular/router';
~~~~~~~~~~~~~~~~~
client/src/app/sign-up/sign-up.component.ts:2:40 - error TS2307: Cannot find module '@angular/forms' or its corresponding type declarations.
2 import { FormGroup, FormControl } from '@angular/forms';
~~~~~~~~~~~~~~~~
client/src/app/sign-up/sign-up.component.ts:3:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
3 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/app/task/task.component.ts:5:35 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
5 import { Component, OnInit } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/main.ts:1:32 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
1 import { enableProdMode } from '@angular/core';
~~~~~~~~~~~~~~~
client/src/main.ts:2:40 - error TS2307: Cannot find module '@angular/platform-browser-dynamic' or its corresponding type declarations.
2 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
client/src/test.ts:4:28 - error TS2307: Cannot find module '@angular/core/testing' or its corresponding type declarations.
4 import { getTestBed } from '@angular/core/testing';
~~~~~~~~~~~~~~~~~~~~~~~
client/src/test.ts:8:8 - error TS2307: Cannot find module '@angular/platform-browser-dynamic/testing' or its corresponding type declarations.
8 } from '@angular/platform-browser-dynamic/testing';
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/ngx-spinner/lib/ngx-spinner.component.d.ts:1:79 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
1 import { OnDestroy, OnInit, OnChanges, SimpleChange, ChangeDetectorRef } from '@angular/core';
~~~~~~~~~~~~~~~
node_modules/ngx-spinner/lib/safe-html.pipe.d.ts:1:40 - error TS2307: Cannot find module '@angular/platform-browser' or its corresponding type declarations.
1 import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
~~~~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/ngx-spinner/lib/safe-html.pipe.d.ts:2:31 - error TS2307: Cannot find module '@angular/core' or its corresponding type declarations.
2 import { PipeTransform } from '@angular/core';
~~~~~~~~~~~~~~~
Found 40 error(s).
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! server@0.0.1 postinstall: `nest build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the server@0.0.1 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /tmp/npmcache.euxxt/_logs/2020-08-25T12_12_21_031Z-debug.log
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
Some possible problems:
- Node version not specified in package.json
https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
- A module may be missing from 'dependencies' in package.json
https://devcenter.heroku.com/articles/troubleshooting-node-deploys#ensure-you-aren-t-relying-on-untracked-dependencies
Love,
Heroku
! Push rejected, failed to compile Node.js app.
! Push failed
嵌套包.json
{
"name": "server",
"version": "0.0.1",
"description": "",
"author": "",
"private": true,
"license": "UNLICENSED",
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start": "nest start",
"start:dev": "nest start --watch",
"start:debug": "nest start --debug --watch",
"start:prod": "node dist/src/main",
"lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json",
"postinstall": "nest build"
},
"dependencies": {
"@nestjs/common": "^7.0.0",
"@nestjs/core": "^7.0.0",
"@nestjs/mongoose": "^7.0.2",
"@nestjs/platform-express": "^7.0.0",
"@nestjs/serve-static": "^2.1.3",
"bcrpyt": "^2.0.0",
"bcrypt": "^5.0.0",
"bootstrap": "^4.5.0",
"dotenv": "^8.2.0",
"jsonwebtoken": "^8.5.1",
"mongoose": "^5.9.25",
"ngx-spinner": "^10.0.1",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^6.5.4"
},
"devDependencies": {
"@nestjs/cli": "^7.0.0",
"@nestjs/schematics": "^7.0.0",
"@nestjs/testing": "^7.0.0",
"@types/express": "^4.17.3",
"@types/jest": "25.2.3",
"@types/mongoose": "^5.7.32",
"@types/node": "^13.9.1",
"@types/supertest": "^2.0.8",
"@typescript-eslint/eslint-plugin": "3.0.2",
"@typescript-eslint/parser": "3.0.2",
"eslint": "7.1.0",
"eslint-config-prettier": "^6.10.0",
"eslint-plugin-import": "^2.20.1",
"jest": "26.0.1",
"prettier": "^1.19.1",
"supertest": "^4.0.2",
"ts-jest": "26.1.0",
"ts-loader": "^6.2.1",
"ts-node": "^8.6.2",
"tsconfig-paths": "^3.9.0",
"typescript": "^3.7.4"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".spec.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"coverageDirectory": "../coverage",
"testEnvironment": "node"
}
}
角度包.json
{
"name": "client",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "(if exist ..\\server\\front rmdir ..\\server\\front /s /q) && ng build --prod && move dist/client ..\\server\front",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"postinstall": "ng build --aot --prod",
"heroku-postbuild": "ng build --prod"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.0.6",
"@angular/common": "~10.0.6",
"@angular/compiler": "~10.0.6",
"@angular/core": "~10.0.6",
"@angular/forms": "~10.0.6",
"@angular/platform-browser": "~10.0.6",
"@angular/platform-browser-dynamic": "~10.0.6",
"@angular/router": "~10.0.6",
"@auth0/angular-jwt": "^5.0.1",
"auth0": "^2.27.1",
"enhanced": "^1.2.1",
"ngx-spinner": "^10.0.1",
"rxjs": "~6.5.5",
"tslib": "^2.0.0",
"zone.js": "~0.10.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1000.5",
"@angular/cli": "~10.0.5",
"@angular/compiler-cli": "~10.0.6",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~3.3.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~3.9.5"
}
}
现在我很困惑，我不知道该怎么办。任何帮助都会非常感谢您的时间
解决方案
推荐阅读
- r - 更正数据框中的变量值，使用 R 中另一个数据框中的变量特定值应用函数
- javascript - 单击后更改颜色并停止功能（仅 JavaScript）
- angular - 在 Angular 8 中添加的 Bing 地图中禁用 Bing 徽标
- android - 如何使用bundle从android传递JSON以响应本机
- java - 使用 Scanner 时的资源泄漏警告
- c# - 我用 mvc 分页丢失了过滤器数据，而我用 viewmodel 过滤而不是文本
- python-3.x - 使用较短的列表作为值
- google-apps-script - 使用谷歌应用脚本将 xlsb 转换为谷歌表格
- python - 具有多类型参数的python并行函数
- c - 如何修复我的 stringcompare 函数，以便它测量整个字符串