vuejs怎么在服务器部署

vuejs怎么在服务器部署,第1张

简单项目启动的话一般在1秒左右你打开tomcat目录看看webapp里面有没有你的项目文件夹就知道了,你用的myeclipse的话,部署很简单,在服务器图标左侧有个部署按钮,把项目add到服务器里就可以了

webpack本身有dev和prodcution两套环境,我们的项目还有uat环境,只有两套环境并无法满足项目开发的需要,因为我参考webpack搭建dev环境的方式搭建了uat环境。
首先,找到项目的packagejson,找到scripts,加上uat指令的定义,

很容易理解,当我们执行npm run dev时候执行node中build目录的dev-serverjs,所以我们定义了uat指令执行uat-serverjs。
uat-serverjs

webpackuatconfjs

uatenvjs

找到config下方的indexjs
在dev下方增加uat的配置,配置如下:

这样,搭建了dev,uat和production三套环境,我们在devenvjs增加API_ROOT:

在prodenvjs增加API_ROOT:

在配置api接口的文件中,将baseURL设置成:

这里以axios的设置为例,项目根据实际情况调整。
如此,当我们运行

指向的域名服务器是

当我们运行

指向的域名服务器是

这是前面配置的自定义指令,可根据项目实际情况定义自己的指令
当我们运行

指向的域名服务器是

打包项目的时候,打包的是根据服务器获取到相应的接口,我们就不用调来调去,也不容易出错,有问题欢迎留言讨论。

vite是vue3推荐的打包工具,相较于webpack,Vite 是基于 native ES module —— 现代浏览器基本已经全部支持了import/export 语法。 在Vite中,启动本地服务器,是不需要提交编译文件的, 而是在浏览器请求对应URL时, 再提供文件,实现了真正的路由懒加载, 这个比起Webpack节省了不少时间。打包和响应速度提升10倍以上

若您的版本低于40
请使用 vue upgrade 命令更新cli

我们选中vue,按回车确定

然后选择vue-ts,回车确认

启动后在浏览器输入: >

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zz/12768513.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-27
下一篇 2023-05-27

发表评论

登录后才能评论

评论列表(0条)

保存