Nuxt.js是一个基于Vue.js的通用应用框架,它为我们提供了一个代码结构清晰、开箱即用的应用搭建模板。如果你还不熟悉Nuxt.js,请先参考官方文档。
在Nuxt.js开发完应用后,我们需要将其部署到服务器上。下面是一个简单的Nuxt.js应用部署过程。
步骤一:在服务器中安装Node.js
# 使用官方源下载最新版本的Node.js
curl -sL https://deb.nodesource.com/setup_current.x | sudo bash -
# 安装Node.js和npm
sudo apt-get install -y nodejs
步骤二:在服务器中安装Nginx
# 安装Nginx
sudo apt-get install nginx
步骤三:生成Nuxt.js的静态文件
在本地中使用Nuxt.js生成静态文件:
npm run generate
将生成的文件上传到服务器中,存放在临时目录中。
步骤四:在Nginx中配置反向代理
在Nginx的配置文件中加入如下配置。
server {
listen 80;
server_name mydomain.com;
location / {
root /usr/share/nginx/html;
try_files $uri $uri/ @nodejs;
}
location @nodejs {
rewrite ^(.*)$ /index.html last;
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
其中,mydomain.com
替换成你的域名,/usr/share/nginx/html
需要改为Nuxt.js静态文件所在的临时目录。
步骤五:启动Nuxt.js服务
npm run start
现在访问http://mydomain.com
,即可看到部署在服务器上的Nuxt.js应用。