如何将vue项目打包在服务器上运行

这里使用node.js 的Express（web应用框架）来运行我们用vue写好的项目。
1.首先通过win10自带的远程桌面连接就能进入到windows服务器

2.下载node.js
      进入官网下载 https://nodejs.org/zh-cn/download/ 我下载的是64为的msi的安装包格式
3.进入服务器安装node
      把node的安装包复制粘贴到服务器进行安装。

4.安装express-generator工具
      打开命令行输入 npm install express-generator -g

npm install express-generator -g

提示：在桌面直接按住shift然后点击鼠标右键，有在此处打开命令窗口的选项，这样就能直接把命令行的路径跳转到桌面，后面新建的项目也就直接放在桌面了

5.搭建express项目在命令行输入格式： express 项目名

express test

这样就在桌面就生成了一个test文件夹，我们只要将打包后的项目丢进去启动起开就能访问了。

6.把我们的 vue项目打包后的dist目录中的static和index.html 复制到服务器test文件夹下的public文件夹里面。

7.接着把服务器的项目跑起来就能访问了。
首先进入服务器的test文件夹下面，按住shift+右键。选择在此处打开命令窗口

然后命令行终端的路径就直接在我们项目的文件夹了。输入 npm install 安装依赖

npm install

最后就是把这个项目启动了。输入 npm run start

npm run start

没有报错的话我们就能通过 服务器ip:3000 访问。

可能出现的问题：
1.默认的启动端口在3000，如果这个端口被占用了就可以到 bin目录的 www文件里面把3000 改为其他端口。
2.出现无法访问还可能是服务器的端口未开放。要进到服务器的安全组里面添加访问规则。

如何将vue项目打包在服务器上运行相关推荐

vue项目如何放到服务器上,怎么把vue项目放在node服务器上？
Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合. 将vue项目 ...
宝塔面板部署vue项目到云服务器上（Nginx服务器）
前言: 之前使用终端安装nginx,后来崩了因为自己宝塔也安了后来服务器重装决定只用宝塔的nginx部署步骤: 1.填加站点 2.第一行随便写一行域名后面删掉就行第二行ip:端口 php版 ...
vue项目如何放到服务器上,Vue项目怎么上传到云服务器
Vue项目怎么上传到云服务器内容精选换一换本章节以Linux操作系统为例,指导您通过弹性云服务器内网方式连接GaussDB(for Redis)实例.使用内网连接GaussDB(for Redi ...
记录第一次成功将vue项目打包并部署到centos云服务器上并访问(包含多个vue项目部署nginx配置说明)
文章目录准备 vue项目打包配置服务器使用xshell 使用xftp 当项目更新时操作小结准备 vscode:用于打包vue项目(需要提前安装好node与npm,推荐使用mvn管理node, ...
vue项目打包到腾讯云服务器全过程
本文将记录vue项目打包放到服务器的整个过程,本文中的例子是express+vue,希望能给遇到这方面问题的同学一个解决办法. 登录服务器假定已经拥有一个服务器账号,然后下载一个xftp5用来作文件 ...
Vue.js-localhost:8080-无法显示此网页-【已经初始化的项目，如何再次在服务器上运行?】
Vue.js---初始化项目: Vue.js-Day03-AM[超级详细:Node.js环境安装.安装淘宝镜像(Win.Mac).安装Vue脚手架.初始化Vue项目-命令解释(Vscode.命令行窗口 ...
vue项目打包部署注意点 + 宝塔面板几步部署项目
1.vue项目打包 1.1 终端运行打包命令在编辑器的终端运行vue项目打包命令 yarn run build 打包成功如下: 这时我们可以看到项目目录多出来一个dist文件夹,记住它,后面部署就靠 ...
将vue项目打包部署到云服务器（傻瓜式宝塔面板）
前提准备拥有一台云服务器(以个人的轻量级云服务器视角) 下载Xshell 先将自己的vue项目打包,得到dist就行 npm run build 通过xhsell连接云服务器第一步应该是先创建实例 ...
Java和Vue项目打包并进行服务器部署
两周前我刚刚入职实习的时候,后端的几个同事看到我需要学习如何把项目进行部署,都围过来教我怎么部署,我感觉学习到了很多,因此,记录一下学习的笔记. 当然了,这些部署是建立在已经配置好tomcat(后端服 ...

如何将vue项目打包在服务器上运行

如何将vue项目打包在服务器上运行相关推荐

最新文章

热门文章