nuxt版本:0.10.6

技术栈:nuxt.js, express, pm2

部署环境:windows server

之前用nuxt.js 的express的模板项目在windows下用nginx进行代理访问,其实有点多余,直接用host文件就可以达到相同的效果,仅供娱乐吧,熟悉一下nginx的基本配置也是好的,其实这段时间研究nuxt.js比较多,主要还是想提高客户端访问首页更快一点。

之前使用nuxt.js generate直接生成对应的html静态文件,这个不需要服务器安装什么特殊的环境。

以iis为例,直接把dist文件夹下生成的文件丢到对应的目录就可以了,其他的也是一样拷贝目录文件,这种方式是客户端访问最快的方式,但是生成html静态文件的过程可能有点痛苦,服务器数据有变化的时候要及时地更新对应的静态html文件,比如要跑一些增量更新数据的服务,数据更新这一块的复杂度就上去了。(后续再补充一下nuxt.js 用generate命令生成静态html的范例)

对于后端数据变化比较频繁且及时性要求高的应用来说,需要生成静态html文件很多的情况下,循环生成的方式难以满足要求,以下是一个nuxt.js在服务端世界挂在node.js的环境运行的方式。

生成模板项目

vue init nuxt/express mynuxtexpress

拷贝mynuxtexpress目录下的文件夹到服务器上,例如我拷贝到D:\nuxt目录下

服务器上需要安装node.js,安装好后,cmd打开D:\nuxt目录,更新依赖包

npm install

编译

npm run build

运行

npm run start

浏览器输入http://localhost:3000就可以正常访问了,但是在服务器上如果关掉了cmd命令行窗口,服务就自动停止了

这里介绍一个管理node.js应用进程的管理器pm2,安装也很简单

npm install -g pm2

然后使用pm2启动应用

pm2 start ./build/main.js

启动成功后

基本到这里环境就差不多了,nuxt.js源代码如果不想放在服务器上,可以删除除了.nuxt, build, node_modules文件夹和package.json文件的其他文件和文件夹,但是每次发布build和.nuxt两个文件夹和package.json文件需要进行更新,如有依赖包更新,直接运行更新依赖包命令就可以了

另外默认的服务是host在127.0.0.1本机上,在部分服务器上,如云服务器使用虚拟ip的服务器上,localhost和127.0.0.1都可以访问,但是使用内网的ip无法访问,这也直接导致了服务器外网即使端口开启了,也没有办法访问站点,需要更改server/index.js的host配置,去掉host参数

然后重新编译运行,发布就可以了。

nuxt.js还在发展阶段,很期待即将到来的1.0的版本,其实现在线上的项目已经开始使用了,如果觉得不错,那么试一试吧,用得人多了,发展也就更快了!

nuxt.js express模板项目服务器部署的更多相关文章

  1. nuxt.js express模板项目IIS部署

    继续上一篇的nuxt/express项目部署,还是windows上要把nuxt的服务端渲染项目跑起来,这次的目的是用已经有的域名windows服务器上一个虚拟目录反向代理部署在其他端口nuxt项目. ...

  2. nuxt.js express模板项目虚拟目录部署问题汇总

    声明环境 反向代理:nginx或者iis的ARR 模板项目:nuxt-express 部署环境:windows 经过了一段时间在windows环境部署项目来看,关于虚拟目录的问题汇总如下, 发布场景假 ...

  3. Node.js Express+Mongodb 项目实战

    Node.js Express+Mongodb 项目实战 这是一个简单的商品管理系统的小项目,包含的功能还算挺全的,项目涵盖了登录.注册,图片上传以及对商品进行增.删.查.改等操作,对于新手来说是个很 ...

  4. 从壹开始 [ Nuxt.js ] 之二 || 项目搭建 与 接口API

    前言 哈喽大家周一好,今天的内容比较多,主要就是包括:把前端页面的展示页给搭出来,然后调通接口API,可以添加数据,这两天我也一直在开发,本来想一篇一篇的写,发现可能会比较简单,就索性把项目搭建的过程 ...

  5. [转] node.js express的安装与部署,以及pm2下的运行启动。

    node.js 下的express 安装可以参考官方网站的 http://www.expressjs.com.cn/ 这里主要讲一下一些不同的地方,将我们生成的dist文件夹里的文件放在public里 ...

  6. 浅析Python项目服务器部署

    基础理论 关于Web服务器和应用服务器 基本概念: Web服务器主要功能就是存储.处理.传递网页,客户端和服务器之间基于HTTP协议进行通信. 应用服务器主要是处理动态请求,调用相应的对象完成对请求的 ...

  7. 总结在Visual Studio Code创建Node.js+Express+handlebars项目

    一.安装node.js环境. Node.js安装包及源码下载地址为:https://nodejs.org/en/download/ 32 位安装包下载地址 : https://nodejs.org/d ...

  8. JAVA项目服务器部署

    1.下载 Java JDK 搜索jdk下载,然后进入JAVA官方网站jdk下载页,选择自己的对应的操作系统,点击下载 https://www.oracle.com/technetwork/java/j ...

  9. next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序

    前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...

随机推荐

  1. 005 Longest Palindromic Substring 最长回文子串

    Given a string s, find the longest palindromic substring in s. You may assume that the maximum lengt ...

  2. 两个线程分别打印 1- 100,A 打印偶数, B打印奇数

    package com.demo.thread; public class PrintNumber { private static Object lock = new Object(); priva ...

  3. Java文件与io——NewIO

    为啥要使用NIO? NIO的创建目的是为了让JAVA程序员可以实现高速I/O而无需编写自定义的本机代码.NIO将最耗时的I/O操作(即填充和提取缓冲区)转移回操作系统,因而可以极大地提高速度 流与快的 ...

  4. php版给UEditor的图片在线管理栏目增加图片删除功能

    1.找到uedior/dialogs/image/image.js文件,Add为修改部分的代码: /** * tab点击处理事件 * @param tabHeads * @param tabBodys ...

  5. web.config文件executionTimeout的单位

      executionTimeout:表示允许执行请求的最大时间限制,单位为秒

  6. java 从List<Integer> 中随机获取6个数

    List<Integer> list 为不重复的数字集合,例如:1,2,3,4,5,6,7,8,9,10 从中随机获取不重复的6个数.代码如下. List<Integer> l ...

  7. 《C#高效编程》读书笔记12-使用推荐成员初始化器而不是赋值语句

    通常来说类都有不止一个构造函数.随着时间推移,成员变量的增加,构造函数的个数也会不断的增加.预防这种情况的最好方法是,在声明变量的时候就进行初始化,而不是在每个构造函数中进行. //初始化变量时声明 ...

  8. KendoUI 自定义验证:

    Html: <label>@LogicNameAttribute.GetLogicName(typeof(Reward).GetProperty("ExtraRewardMone ...

  9. mysql通用分页存储过程遇到的问题

    DELIMITER $$ USE `tsb_asksys`$$ DROP PROCEDURE IF EXISTS `P_viewPage`$$ CREATE DEFINER=`root`@`local ...

  10. 从零开始的全栈工程师——js篇2.8

    DOM(document object model) DOM主要研究htmll中的节点(也就是标签) 对节点进行操作    可以改变标签  改变标签属性  改变css样式  添加事件 一.操作流程 1 ...