Nuxt服务端渲染
文章平均质量分 88
nuxt服务端渲染的学习或者实战经验
wantLG
我不是代码的搬运工,我只是BUG的创造者...欢迎交流;
if(true){
return "I create BUG";
}
展开
-
在云服务器上部署nuxt服务端渲染服务(亲测线上)
打包完毕得到最新的.nuxt包注意:.nuxt文件是以.开头的,属于隐藏文件,mac电脑快捷键shift+command+. 可以显示出隐藏文件;windows的话查看文件夹选项,勾上显示隐藏文件原创 2022-06-12 14:10:06 · 2828 阅读 · 3 评论 -
实测在Nuxt中自定义loading加载效果,搭配nuxt/axios拦截器
首先说一下我用的loading是一个第三方json动画库,底层用了window和document对象,在服务端会报错,只能在客户端跑。所以在服务端运行的请求钩子是不能进行loading效果的先引入第三方动画库lottiefiles我的版本是^1.5.6npm install @lottiefiles/lottie-player在plugins下创建一个Loading文件夹,Loading下创建一个lottiePlayer.js全局引入该模块// 引入lottiefilesimpo.原创 2022-04-25 17:40:03 · 3148 阅读 · 0 评论 -
实测Nuxt坑,配置@nuxt/axios、拦截器、代理跨域,请求
下载第三方模块@nuxtjs/axiosnpm install @nuxtjs/axios// 自动帮你下载@nuxtjs/proxy在nuxt.config.js中配置代理和启用@nuxtjs/axios模块下面一些配置都是我的各环境变量不会的话参考普歌-实测Nuxt.js入坑,配置dev、test、pro三种环境的变量envmodule.exports = { // 环境变量 env: { NODE_ENV: env[process.env.NODE_ENV].NODE原创 2022-04-25 17:28:10 · 2572 阅读 · 0 评论 -
Nuxt.js优化坑、进行CDN加速(axios/jQuery/swiper/vue-lazyload图片懒加载等进行cdn加载)、elementui进行按需加载
(亲测有效)服务端渲染nuxt对axios/jQuery/swiper/vue-lazyload启用cdn加速,elementUI进行按需导入前言:在nuxt中做一些性能上的优化其实存在许多坑,尽管nuxt已经帮你做了许多事情,下面是我慢慢捣鼓出来的,有问题的话望大佬指出一 、打包开启打包分析第一步,下载依赖webpack-bundle-analyzernpm i webpack-bundle-analyzer -D第二步,在package.json中scripts中加一项配置 "原创 2021-06-14 14:28:49 · 4581 阅读 · 0 评论 -
实测Nuxt.js入坑,配置dev、test、pro三种环境的变量env
先下载一个cross-env模块,比较好控制环境npm install cross-env在package.json中写入环境的配置 "scripts": { "dev": "cross-env NODE_ENV=dev nuxt --open ", "test": "cross-env NODE_ENV=test nuxt", "build": "cross-env NODE_ENV=pro nuxt build", "start": "cross-env NOD原创 2022-04-25 17:09:41 · 4764 阅读 · 3 评论