声明环境

反向代理:nginx或者iis的ARR

模板项目:nuxt-express

部署环境:windows

经过了一段时间在windows环境部署项目来看,关于虚拟目录的问题汇总如下,

发布场景假设:在站点http://www.test.com/app 下发布

如果我们不更改任何发布配置的话,直接配置地址的反向代理到本地的http://localhost:3000/,由于路径相对引用的问题,会出现发布后图片等资源文件的加载失败。

更改router->base的配置就可以了。

另外还有一个问题是express接口的路由地址也是由于相对路径的问题,导致无法访问对应的express接口。

这就需要去改一下server/index.js里的express的路由配置,为了能达到统一配置的目的,我直接从nuxt.config.js里引用nuxt的router配置项,具体如下

import express from 'express'
import { Nuxt, Builder } from 'nuxt' import api from './api' const app = express()
const host = process.env.HOST || '127.0.0.1'
const port = process.env.PORT || 3003 app.set('port', port) let config = require('../nuxt.config.js')
config.dev = !(process.env.NODE_ENV === 'production') // Import API Routes
app.use(`${config.router.base}api`, api)

注意着色部分修改的地方,端口号和路由地址的配置。

nuxt.js express模板项目虚拟目录部署问题汇总的更多相关文章

  1. nuxt.js express模板项目服务器部署

    nuxt版本:0.10.6 技术栈:nuxt.js, express, pm2 部署环境:windows server 之前用nuxt.js 的express的模板项目在windows下用nginx进 ...

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

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

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

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

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

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

  5. [实战篇]Tomcat发布项目-虚拟目录

    在二阶段学习的过程中,我一直使用MyEclipse的方式把工作空间的项目发布到webapps目录下,这种方式自我感觉在实际开发中应用能在70%左右,但是如何涉及到一些上传操作等操作, 从新发布项目之后 ...

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

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

  7. Nuxt.js 提供了两种发布部署应用的方式:服务端渲染应用部署 和 静态应用部署

    官方网址:https://zh.nuxtjs.org/guide/commands/#%E5%8F%91%E5%B8%83%E9%83%A8%E7%BD%B2

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

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

  9. nuxt.js如何实现同级目录下建多个动态路由,并将链接设置.html后缀

    nuxt.js中如果在同级目录中建两个_xxxx.vue的动态路由文件,那么页面跳转始终是跳的一个页面,如何解决这个问题呢?下面举个栗子: 第一步:新建两个页面文件 第二步:在nuxt.config. ...

随机推荐

  1. 禁用thinkpad触摸板的方法

    控制面板----硬件和声音----设备和打印机----鼠标----ThinkPad------开启触摸板(前面的勾勾去掉)

  2. Bonetrousle HackerRank 数学 + 思维题

    https://www.hackerrank.com/contests/world-codesprint-6/challenges/bonetrousle 给定一个数n,和k个数,1--k这k个,要求 ...

  3. 是时候搞清楚 Spring Boot 的配置文件 application.properties 了!

    在 Spring Boot 中,配置文件有两种不同的格式,一个是 properties ,另一个是 yaml . 虽然 properties 文件比较常见,但是相对于 properties 而言,ya ...

  4. Vue.extend动态注册子组件

    写本篇文章之前其实也关注过vue中的一个关于加载动态组件is的API,最开始研究它只是用来实现一个tab切换的功能,使用起来也蛮不错的. is 预期:string | Object (组件的选项对象) ...

  5. Kotlin基础知识

    1. 改进点/基础 //安全判空 val length = text?.length; //类型转换 if (object is Car) { var car = object as Ca } //操 ...

  6. 3年,阅读量100万+, Github Star 15000+

    这两天突然发现,三年前在博客园写的一篇文章阅读量超过百万了,对,还是技术文章.这个让我蛮惊讶的,当时刚开始写这篇文章的时候,一周的阅读量也才两三千,随着时间慢慢的过去,在搜索引擎的加持下竟然超过了百万 ...

  7. 本地添加Maven管理

    Maven下载安装: 1 .Maven下载地址:http://maven.apache.org/ 2 .下载解压到本地指定目录:记住该路径! 3 .新建/修改环境变量-系统变量: 名:M2_HOME ...

  8. 从零开始的全栈工程师——js篇2.17(属性和节点获取)

    DOM 一.节点树状图 Document>documentElement>body>tagname 二.常用的节点类型 元素节点(标签) 文本节点(文本节点) 属性节点(标签里的属性 ...

  9. Error和Exception的区别?

    Error和Exception都继承自Throwable类 二者不同之处在于: Exception: 1.可以是可控制的(checked)或是不可控制的(unchecked) 2.表示一个有程序员编写 ...

  10. 论overflow滚动的重要性

    原理 设置一个块级作用域溢出的效果,只需要在外部块的位置上设置overflow:scroll和height:xx即可. 此时,块级作用域的内容位移超出外部块的位移就会出现滚动条,当内部块滚动时,我们能 ...