0%

前言

本文将详细介绍如何实现一个 Next.js 项目的持续集成和自动化部署,鉴于自建 gitlab 和 gitlab-runner 有一定的服务器硬件要求,并且需要一定的时间成本,不是本文的重点,所以我们使用现成的 Github 作为本次教程代码管理工具,Travis CI 来自动化构建, 使用 PM2 作服务器的进程管理工具来完成本次教程。下面我列出本次教程所需的物理材料:

  • Linux 远程服务器(笔者使用的版本:Ubuntu 18.04)
  • 本地个人开发主机

后文笔者将分别用 remote 和 local 简称上述材料

部署策略简述

我先把整个部署的策略按照步骤大致列一下,好让跟学的同学心里有个谱,判定一下符不符合自己的学习诉求

  1. 使用 Github 托管源码
  2. Travis CI 构建生产包,并将构建包提交到 Github 的部署分支(命名如:DEPLOY-PROD)上
  3. Travis CI 完成构建包的推送后,调用 PM2 的 deploy 命令, 触发 remote 服务器拉取最新的构建包,然后自动重启服务
阅读全文 »

前言

有关Next.js、同构直出、SEO、SPA等相关介绍将不再赘述,本文主要针对Next.js配合typescript和mobx搭建一个完整的生产部署的前端工程进行核心代码的分析以及主要坑点的讲解,非Next.js入门课程,下面我将会列出本教程所需要的前置预备知识和能力:

  • nodejs服务端编程基础
  • 已至少阅读一遍Next.js官方文档
  • 熟练使用reactjs
  • 熟练使用webpack
  • 理解同构直出的概念和它解决了什么样的痛点
  • 有一定的前端工程化、自动化部署的经验

正文开始时,也就默认了有缘阅读到此文的同学均具备上述能力

仓库地址:nextjs-mobx-typescript
demo预览地址: d.echo-lynn.com
原文地址:Echo Lynn’s Blog

作者将在原文上持续分享关于Next.js的高级拓展经验,有兴趣的朋友也可以在博客上留言你遇到的问题或者与作者交流

阅读全文 »