TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 10、《工程化部署》

1、前言

在实际业务开发中，会遇到这样一种需求，使用VUE的页面须要支持SEO，同时对首屏有指标性要求，目前市面上广泛使用的是Nuxt.js解决方案，在引入的同时还须要考虑与现有的全栈工程结合，本系列文章探讨的是此类全栈工程的解决方案，同时使用的是TypeScript应用于先后端编程，文章中介绍的工程与技术要点源码已上传至Github，有须要的朋友可自行下载：
Nuxt.js和Nest.js同构工程

复制代码

文章意在抛砖引玉，先后端使用同一种语言TypeScript编写，示例已包含基本接口请求，数据库链接应用，公用模块封装等实际开发中使用到的内容。

效果预览:

如下为该系列文章入口列表:
TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 1、《简介》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 2、《框架融合》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 3、《配置服务》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 4、《UI系统》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 5、《API服务设计》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 6、《SEO功能实现》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 7、《Vuex使用》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 8、《接入Mongo DB服务》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 9、《TypeScript》

TypeScript全栈工程实战-(Nuxt. js & Nest. js) - 10、《工程化部署》

2、编译

本文本地针对产生发布与部署展开，第一步则须要创建编译机制，通常在必定规模团队的公司体系中，服务器编译基本交给运维自动化部署系统来编译，所以，工程须要作的是在npm script中暴露编译命令，在本示例中使用的是npm run build

"build": "npm run lint && cross-env NODE_ENV=production npm run clean && nuxt build && tsc",
复制代码

在开始编译以前，使用了lint做语法检查，在这一过程当中不经过则会抛错，没法进行下一步编译操做

"lint": "tslint -p tsconfig.json -c tslint.json",
复制代码

当这一过程完成以后，下一步才是调用

nuxt build && tsc
复制代码

先后端编译

3、启动

启动一样遵循以上规则，通常为默认的npm run start或者npm start

"start": "npm run cover && cross-env NODE_ENV=production node dist/src/server/main.js",
复制代码

start启动的则是编译后转译的dist目录下的服务端入口。

4、普通部署

完成以上两步骤以后，若是是LINUX普通环境部署，则须要要求运维平台在启动命令调用前设置环境变量和端口，对应的代码层面接收是这样的：

5、Docker容器部署

Docker部署官方CLI工具默认集成，@nestjs/cli

npm install -g @nestjs/cli
复制代码

• 在根目录部署docker-compose.yml

  

• Dockerfile