继上一篇文章之后,我把开发的系统放到阿里云服务器当中,并且成功上线。
01 前言
继上一篇文章之后,上一次我写的是前端搭建的后台系统如何与本地数据库或者线上数据库连接的文章,但是我们所有开发的项目不可能是放在本地运行的,怎么也得把它放到服务器上面,让别人也可以通过你的公网地址访问,今天折腾了一下还是挺费劲的,遇到了几个坑,接下来就跟大家说一下如何解决这些问题。
但是你如果要把项目放到服务器的话肯定是要有一台属于你的服务器,不然的话也没办法做。如果你还没有的话可以去阿里云买一个,学生价也是比较便宜的,一年也就100多。这里我是推荐大家一定要玩一下服务器怎么操作,也是作为前端的必备技能之一,废话少说,开始。
02 连接服务器
首先我们购买服务器之后就进行连接一下,关于怎么购买和配置等的内容大家可以网上找一下,很简单的操作。
我们可以选择一个连接工具,我这里选择的是FinalShell,大家也可以选择其他的。我们先打开软件新建一个链接,输入服务器的公网IP和密码你就可以连接了。
由于服务器大都是使用linux系统,所以大家就必须知道一些linux的指令,方便我们进行文件操作。常用的指令就几种而已,复杂的基本上用不到,作为初学者的我们就了解即可。
- cd 进入某一个文件夹,可以进入多级,如 cd var/www/ 这种
- ls 查看当前的文件夹有哪些文件或者文件夹
- pwd 查看当前你的位置是哪里
- vim xxx 编辑xxx这个文件,进去之后输入i就可以编辑了,完了之后按退出键(esc),然后输入:wq退出并保存
- cat xxx 查看xxx这个文件
了解了这些你就可以上手服务器部署了,其实是比较简单的操作,但是有一些删除的指令就不要乱学了,防止小白乱操作整坏了自己的服务器,这个finalshell可以通过右键进行上传或者删除操作,适合入门和那些习惯window的小伙伴。
03 文件上传
连接上了之后,基本上和window的操作差不多,你选择一个位置放你的项目,我一般是放在 var/www下面。大家也可以选择你任意的位置,记住放在哪里就好了。
路径引入问题
我们在上传之前要对你的项目进行打包,执行npm run build 进行项目的打包,这是你项目上线部署才需要做的,一般我们平时开发都是使用npm run dev 来启动一个本地的服务器。但是你在打包之前要改一些东西,不然你的项目放上去之后是无法访问的。要改哪里呢