其实这个网上已经有了很多人写了,为什么我还要再写这一篇博客?因为我亲身把他们生产的坑给踩了个通透(摊手。
正文开始
本次的项目是基于vue-cli生成的项目,采用的vue-router的history模式。到这里相信大部人还是类似了,接下来就是一个坑死人不偿命的网上诸多博客都在采用的巨坑。
在进行打包的时候,很多博客里都写了,将/config/index.js
下,build中的assetsPublicPath
从/
改为./
。我很后悔,为什么当初这样照做的时候不去思考为什么,为什么要这样做,凭什么?如果这个有问题为什么webpack生成的时候不改反而一直放在那里?是谁傻?问题先放在这里,我们先按照那些教程走。修改完后npm run build
,这样在你的项目下就生成了一个dist文件夹,里面就是生成的静态内容。假设现在你的dist文件夹已经在你的云服务器中了。接下来开始nginx的配置。
个人采用的是sudo apt-get install nginx
安装的nginx,现在在命令行下,
cd /etc/nginx/conf.d/
, 并在该目录下 sudo touch vueSite.conf
,接下来修改该文件内容。
server {
listen 3000; # 假设你项目监听的是3000端