每日鸡汤:每个你想要学习的瞬间都是未来的你向自己求救
非服务端渲染的项目,比如普通的vite + vue项目,我们在部署生产环境的时候,只需要两步
- 运行 npm run build 然后得到了一个 dist 文件夹
- 将这个dist文件夹部署到一个静态服务器上
一般来说这样就可以访问这个项目了
但是服务端渲染的项目有所不同,因为会需要在服务端运行一些代码,所以一个普通的静态服务器满足不了我们需求,我们需要在服务器端运行自己的服务端代码,所以 nuxt 项目是使用 npm run preview 这个命令运行打包出来的文件。
在部署过程中还有一个问题刚开始不懂 ,就是build 和generate 命令有啥不同!来看一下官网文档的描述
The
build
command creates a.output
directory with all your application, server and dependencies ready for production.build命令创建了一个.output目录,其中包含所有可用于生产的应用程序、服务器和依赖项。
使用 npm run generate 打包出来的文件如下
build 命令会生成一个server、一个public 的文件夹,build完之后运行npm run preview 你会发现在控制台不会打印log,此时preveiw 的本质是运行了 这句命令 ,官方文档
node .output/server/index.mjs
The
generate
command pre-renders every route of your application and stores the result in plain HTML files that you can deploy on any static hosting services. The command triggers thenuxi build
command with theprerender
argument set totrue
generate命令预呈现应用程序的每个路由,并将结果存储在可以部署在任何静态托管服务上的纯HTML文件中。该命令触发nuxi build命令,prerender参数设置为true
使用 npm run generate 打包出来的文件如下
generate
命令只会生成一个public文件夹,generate
完之后运行npm run preview 你会发现在控制台每次刷新页面就会打印出来很多日志,此时preview命令本质是运行了这句命令npx serve .output/public
在实际部署过程中,运行 preview命令打印log, 会很占用资源,而且会导致服务重启,出现502的情况,所以如果你的资源不够用还是建议使用 build + preview 的方式部署
nuxt2 项目使用 npm run generate + npm run start 就不会有这些日志打印文章来源:https://www.toymoban.com/news/detail-605678.html
nuxt3 官方文档只写了 preview命令,没写start, 但是其实start也可以用,他俩本质是一样的。至于运行起来后的现象,取决于使用了build 还是generate文章来源地址https://www.toymoban.com/news/detail-605678.html
到了这里,关于nuxt项目部署,npm run build 和npm run generate的区别的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!