Linux下如何部署Nuxt项目(二)

news2024/10/6 18:36:35

Linux下如何部署Nuxt项目(一)_小鸟哗啦啦的博客-CSDN博客,书接上回,以实际场景开始。

请认真看完这篇文章,还不会部署Nuxt,我直接拿弹弓打你们家玻璃!

一、nuxt的配置检查

服务端渲染的应用,应该是先编译构建,然后再去启动nuxt服务。如果你不build,而是直接运行 npm run dev 这种,没有经过webpack压缩,请求资源会相当的饿耗时。也就是上一篇文章中说的根本不是部署!!!

1.package.json中描述:

nuxt: 启动热更新的web服务器,当然指的是开发模式

nuxt build: webpack进行打包

nuxt start: 这才是生产部署的指令,当然也是启动一个web服务器

{
  "name": "my-nuxt-web",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "web": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },
  "dependencies": {
    "@nuxt/http": "^0.6.4",
    "bootstrap": "^4.6.0",
    "bootstrap-vue": "^2.21.2",
    "compression-webpack-plugin": "6.1.1",
    "core-js": "^3.15.1",
    "element-ui": "^2.15.13",
    "nuxt": "^2.15.7"
  },
  "devDependencies": {
    "@nuxtjs/style-resources": "^1.2.1",
    "less": "^4.1.2",
    "less-loader": "^7.3.0"
  }
}
2.nuxt.config.js 

也是非常重要的配置文件,这里只说重要的几个属性:

// 生产环境 必须是 service
target: "service", 

// server 的配置
server: {
  port: "3001",
  host: "0.0.0.0" // 必须是 0.0.0.0
},

target:开发环境为 static,生产打包时必须是 service,否则你运行 npm run start 就会报错:

Error: Output directory `dist\` does not exist, please use `nuxt generate` before `nuxt start` for static target.

不要怀疑是路径问题,就是target配置错了。官网的配置介绍:Nuxt 2 - Commands and Deployment

server: host的配置必须为本机,否则你会发现部署后访问不到资源。 

二、nuxt的本地打包检查

你可能会觉得有点多余,但本地先操作会使一些问题变得好定位,比如说本地没有问题,部署发现访问不到,就可以定位到问题是服务器的端口未开放 或者 防火墙未关闭。

1. 直接运行 npm run build  --- 没有错误

2. 直接运行 npm run start ---没有错误

恭喜,完成部署前的一切检查!

三、nuxt的线上发布

两种方式:

1.本地工程全量上传至服务器,甚至可以本地打包,node_modules也上传,直接跳转到第3步

2.选择必要的文件,上传至服务器 比如说 Nuxt 文件夹

.nuxt // 文件夹 (build之后,内部会有个dist目录)
static // 静态不编译的文件夹
package.json // 配置文件
nuxt.config.js // 配置文件

 终端进入Nuxt文件夹中:这里推荐yarn,npm坑了我一把

yarn install

3.启动服务

pm2 start npm --name "my-nuxt-web" -- run start

查看进程 pm2 list,行了,自己玩去吧

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/751785.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

智能手表学习笔记

一、相关知识模块 1、RTOS & FreeRTOS (1) RTOS 实时操作系统(Real Time Operating System) 是指当外界事件或数据产生时,能够接受并以足够快的速度予以处理,其处理的结果又能在规定的时间之内来控制…

信号完整性分析基础知识之有损传输线、上升时间衰减和材料特性(二):损耗的来源

导体电阻和趋肤深度 信号沿信号路径和返回路径传播的串联电阻与导体的体电阻率和电流传播的横截面有关。直流时,信号导体中的电流分布均匀,电阻为: ρ表示电阻的体电阻率,w表示线宽,t表示导体厚度,Len表示走…

7.10蓝桥杯刷题

public class _求阶乘和 {public static void main(String[] args) {// 根据已有的知识 可以知道的是,现在要求s的末尾九位数字,已知的是39之后的阶乘他的后九位都是0;//所以不需要计算到2023的阶乘//一个数求出来的阶乘想要末尾有0//数中必须要有2和5&a…

C语言每日一练(3)

C 练习实例6 题目:用*号输出字母C的图案。 程序分析:可先用*号在纸上写出字母C,再分行输出。 程序源代码: #include "stdio.h" int main() {printf("用 * 号输出字母 C!\n");printf(" ****\n")…

小红书数据分析工具|年轻人入玄门?小红书热门笔记大赏

当代年轻人血脉觉醒,逐渐出现寺庙打卡、电子木鱼、发疯语录“在上进和上班之间,选择上香”,小编观察近期彩票成为年轻人信仰的新玄学,兴起了“送礼就送刮刮乐”的小风潮。卷不动躺不平的年轻人,严重精神内耗下&#xf…

Pycharm中设置动态模板(自定义自动补齐)

Settings——Editor——Live Template——点击号新增动态模板 Abbreviation缩略词:输入的简写内容 Template text: 简写词对应的模板内容 默认输入简写内容按Tab键,生成模板内容 Define: 选择在哪个语言环境下生效

【WebSocket】

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 3.1 介绍3.2 入门案例3.2.1 案例分析3.2.2 代码开发3.2.3 功能测试 4. 来单提醒4.1 需求分析和设计4.2 代码开发4.3 功能测试 5. 客户催单5.1 需求分析和设计5.2 代…

接口自动化测试,一键快速校验接口返回值全部字段

目录 前言: 一、认识一下,DeepDiff 介绍 主要组成部分: 二、DeepDiff 使用 2.1 案例一:比较两个 JSON 2.2 案例二:比较接口响应 2.3 案例三:正则搜索匹配 三、最后一个小技巧:DeepDiff …

【代码随想录 | Leetcode | 第二天】数组 | 双指针法 | 相向双指针 | 27

前言 欢迎来到小K的Leetcode|代码随想录|专题化专栏,今天将为大家带来双指针法和相向双指针的分享✨ 目录 前言27. 移除元素 27. 移除元素 ✨题目链接点这里 给你一个数组 nums 和一个值 val,你需要 原地 移除所有数值等于val的元素,并返回…

keep-alive和router-view配合使用缓存整个路由页面以及路由切换

实现内容:通过vue实现,在页面有侧边栏动态来展示当前页面流程,右边进行页面的切换,左右两边都是组件,但是A/B/C组件的切换是通过keep-alive搭配router-view实现的,首先在当前文件中创建五个文件&#xff1a…

Linux系统编程(传统信号和实时信号)

文章目录 前言一、传统信号和实时信号概念二、重要函数介绍三、实时信号和传统信号被处理的次数总结 前言 本篇文章我们来讲解传统信号和实时信号,这里我们将从实际应用给大家讲解。 一、传统信号和实时信号概念 传统信号(Traditional Signals&#x…

spring boot学习第一篇:spring boot 1.5.x版本启动接口服务

1、pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation"http://maven.apache.org/POM/4.…

华为云出品《IDEA-Plugin-开发手册》电子书——学完即会场景设计

小智又来给各位开发者送书啦&#xff01; 助力各位开发者们提升技能 海量案例串联 IEDA Plugin 插件开发技能 重实践与验证帮助避免踩坑 学完就可自己完成一些场景设计和开发 适合有一定编程基础&#xff0c;1年以上经验的开发者 适合对IDEA Plugin有学习需求或想拓展业务…

出海企业系列风险分析--网站需要验证码吗?

最近接待了几位从discuz来的用户&#xff0c;说是想要给自己海外的网站安装验证码&#xff0c;但是discuz境外服务器还要解析安装中心的DNS到境外服务器上&#xff0c;所以基于discuz建站的不好之处就在这里。 而且我们还讨论到一个问题&#xff0c;海外的网站&#xff0c;需要…

【线程概念和线程控制】

目录 1 :peach:线程概念 :peach:1.1 :apple:什么是线程&#xff1f;:apple:1.2 :apple:线程的优点和缺点:apple:1.3 :apple:页表的大小:apple:1.4 :apple:线程异常和用途:apple:1.5 :apple:进程VS线程:apple: 2 :peach:线程控制:peach:2.1 :apple:POSIX线程库:apple:2.2 :apple…

tp6的runtime/Logs目录下产生大量日记文件,怎么取消自动生成?

一开始查了好多网上提供的&#xff0c;很幸运都是抄袭别人的&#xff0c;没一个成功&#xff0c;最后无奈只能自己解决方法 其实很简单&#xff0c;不用修改config/log.php文件&#xff0c;没用因为只要有登入错误&#xff0c;警告&#xff0c;消息或者sql错误都会写入 解决方…

windows编译poco c++库

背景 最近有了解到poco c库&#xff0c;这里记录下编译及使用过程。 最开始使用的vs studio 2022 和 poco 1.12.4版本编译&#xff0c;不管openssl 使用哪种版本&#xff0c;都会编译报错&#xff0c;最后妥协了。 参考&#xff1a;https://www.bilibili.com/read/cv1416565…

《语文新读写》期刊简介及投稿邮箱

《语文新读写》期刊简介&#xff1a; 《语文新读写》是“国家期刊奖”获奖期刊&#xff0c;中国期刊方阵双效期刊&#xff0c;中国核心期刊&#xff08;遴选&#xff09;数据库收录期刊&#xff0c;被授予上海市期刊优秀编辑部。杂志的主要读者对象为各大院校、中小学各科教师…

安全帽佩戴检测算法模型训练详细流程

一、任务描述 实际施工现场需要对每个进出的人员进行安全帽监测&#xff0c;对未佩戴安全帽的人员平台进行风险告警&#xff0c;通知工作人员并记录下来。 主要包括三类目标物体&#xff1a;头盔&#xff08;helmet&#xff09;&#xff0c;人&#xff08;person&#xff09;…

100种思维模型之耗散结构理论思维模型-96

避免熵死的方法之一就是建立 耗散结构 。 那么&#xff0c;何谓耗散结构理论&#xff1f; 01、何谓耗散结构思维模型‍‍‍ 一、耗散结构理论 1969年&#xff0c;比利时学者 伊里亚普利高津 在对热力学第二定律研究的基础上&#xff0c;提出了 “耗散结构理论”。 他认…