1、修改config/index.js中的assetsPublicPath: '/',修改為assetsPublicPath: './'
assetsPublicPath: './'
2、在build/utils.js中增加publicPath: '../../'
publicPath: '../../'
3、打開終端,在根目錄下執(zhí)行npm run build進(jìn)行打包,打包成功后會(huì)生成dist
npm run build
4、將dist傳輸?shù)椒?wù)器上(我已經(jīng)把dist重命名為html)
5、服務(wù)器中如果沒有nginx則安裝nginx
sudo apt install nginx
6、配置Nginx,編輯Nginx配置文件/etc/nginx/sites-available/default,并將其更改為以下內(nèi)容
server {
listen 80;
server_name 域名.com; // 替換為您的域名
root /srv/vue/html; // 替換為您的打包文件所在的路徑
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
}
7、保存并關(guān)閉文件后,重新啟動(dòng)Nginx服務(wù)
sudo service nginx restart
注意:如果沒有配置端口規(guī)則的話是訪問不了的,需要開放你的后端端口和前端端口,后端我的是8088,前端是8080。我使用的是寶塔面板,直接在面板的安全中添加規(guī)則即可訪問。
文章來源:http://www.zghlxwxcb.cn/news/detail-733764.html
文章來源地址http://www.zghlxwxcb.cn/news/detail-733764.html
到了這里,關(guān)于Vue+ElementUI項(xiàng)目打包部署到Ubuntu服務(wù)器中的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!