nuxt2静态打包配置
时间: 2023-09-09 16:10:14 浏览: 292
nuxt静态部署打包相对路径操作
5星 · 资源好评率100%
Nuxt.js 是一个基于 Vue.js 的通用应用框架,它可以帮助我们快速搭建服务端渲染的应用,并支持静态化部署。下面是一份 nuxt2 静态打包配置的示例:
首先,在 nuxt.config.js 中进行配置:
```javascript
export default {
mode: 'universal',
generate: {
dir: 'dist'
}
}
```
这里我们使用 `mode: 'universal'` 指定应用的渲染模式为 Universal,即服务端渲染;使用 `generate` 属性配置生成的静态文件存放目录。
然后,在 package.json 中添加打包命令:
```json
{
"scripts": {
"build": "nuxt build && nuxt generate"
}
}
```
这里我们使用 `nuxt build` 命令进行构建,然后使用 `nuxt generate` 命令生成静态文件,最终生成的文件存放在 `dist` 目录下。
最后,运行 `npm run build` 命令进行打包。
需要注意的是,使用静态部署时,需要确保服务器支持静态文件访问,并且需要使用类似 Nginx 的服务器进行配置,以正确地将请求转发到静态文件目录。
阅读全文