head: {
link: [
rel: 'stylesheet',
href: '/css/materialdesignicons.min.css'
2.下载图标文件
https://www.jsdelivr.com/package/npm/@mdi/font
将其中的 css 文件夹和 fonts 文件夹移动到编译后的根目录
再进行部署即可访问
默认的远程加载图标图标本质上就是字体,而vuetify默认从远程地址拉取css和字体文件所以在离线环境下必须使用本地加载字体的方式默认的加载图标的方式如下<link data-n-head="1" rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">使用离线方式加载1.在nuxt
# install dependencies
$ npm install # Or yarn install
# serve with hot reload at localhost:3000
$ npm run dev
# build for production and launch server
$ npm run build
$ npm start
# generate static project
$ npm run generate
有关工作原理的详细说明,请 。
НафронтендеиспользуетсяSSR,точнее通用/同构подход,тоестьпризапросерендерятсянасервере,адальшекакSPA,чтодаетлучшееSEOибыструюотрисовкучемобычноеSPA。
Нафронтетакиетехнологии:
Nuxt.js(SSR)
Node.jsсервер
Webpack 4(содержитбазовыеконфигиподкапотом,которыеиспользуютсячащевсего,ка
7. 部分标签删除时报错:OperationalError
8. 使用命令运行时报错:ModuleNotFoundError
9. 在管理后台删除自己时报错:AttributeError
10. 在set设置环境变量时没有效果
预提交钩子(用于在推入之前运行ci测试)
要拥有一个自以为是的设置和开发工作流程,需要模拟服务器,线控,单元,端到端(E2E),正确的提交日志和检查,然后再进行推送。 有关更多详细信息,请参见模板。
这是的项目模板。
$ vue init joshvillahermosa/nuxt-vuetify-plus my-project
$ cd my-project
# install dependencies
$ npm install # Or yarn install
赛普拉斯集成
赫斯基整合
不才的博客 :smiling_face_with_sunglasses:
巩固知识、打发时间本项目基于两个点进行开发,细节上可能存在的缺陷。
:star-struck:项目介绍
博客主题根据 ps:嘤嘤嘤,还没他的好看
多人博客(每个人都可以发布文章,文章需审核)多人运动???
后台动态角色/权限(超级管理员可进行配置)
资源文件(图片,某些学习资料)集中管理
全站https化
RESETful api规范化
:face_with_symbols_on_mouth:历史版本介绍
都是在校的时候写的
第一版是java servlet写的现在已经没有维护了第二版是koa + mongo + ejs + bootstrap + jquery + layui目前已经关闭,文章数据已迁移 。
:see-no-evil_monkey:未完成的
消息通知(完全没做,大哭)
点赞/喜欢功能(预期)
忘了。 :speak-no-evil_monkey: (日常记性不行)
:alien_monster:技术栈
博客有点为了堆技术栈而堆技术栈的感觉。原本是打算直接3n框
博客地址: :
Starry是一个基于前端的Nuxt + Vuetify,管理端和服务器端分别基于vue + elementui和express + mongoose的个人博客全栈项目,在设计上他采用采用了材料设计的卡片式的文章展示设计,相较于于第一版的个人博客,星空最大的特点是在借由Nuxt支持了ssr以后seo更加的友好,搭配了vuetify之后更是让Starry在移动端有非常优秀的表现。并且自动开发了评论,点赞,私密博客等功能。
但是上面都不是最重要的,我希望Starry能够是一个简单易上手,并且对二次开发非常友好的项目,所以这一版博客进步最大的应该是我对Starry的工程管理,首先Starry的git提交粒度非常的细小,并且几乎每一次提交都有较大的详细说明。其次我开放了一个分支来作为新功能的开发,来保证master的稳定性和健壮性。且此版本的功能目录非常的清晰,在未来也会持续的优化,实现开发者较大的上手和二次开发。
在开发的时候很多配置项,我都刻意的没有写死,我希望能够通过文件或开发Api进行界面配置,为的就是降低
在public/index.html中导入样式
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">...
@vue/cli 4.2.3脚手架创建的Vuetify项目默认使用的是国外CDN上的Roboto和Material Design Icons资源,速度很慢甚至会加载失败,下面记录一下如何把这两个用本地资源代替
修改/public/index.html
删除下面两行引用
<link rel="stylesheet" href="https://fonts.googleapis.com/cs...
通过Vue CLI创建的前端项目,安装Vuetify后,项目加载巨慢。参考
https://vuetifyjs.com/zh-Hans/features/icon-fonts/#material-design56fe6807安装到
删除目录下的的以下代码。
link: [
{ rel: 'shortcut icon', href: '/favicon.ico' },
{ rel: 'apple-touch-icon', href: '/favicon.ico' },
往往达不到效果,仍然加载的是nuxt的默认图标。
后来,经过查找资料文档,发现favicon 的大小应该是32*32像素,否则 nuxt 将加载默认的 favicon 本身。.
nuxt服务端渲染 vue检测图片加载失败onerror时,自定义指令处理
全局注册自定义指令,用于判断当前图片是否能够加载成功,可以加载成功则赋值为img的src属性,否则使用默认图片。
在网络慢的时候,加载图片多的时候,可以达到占位图的效果
// plugins/directive.js
import Vue from "vue";
* 全局注册自定义指令,用于判断当前图片是否能够加载成功,可以加载成功则赋值为img的src属性,否则使用默认图片
* 在网络慢的时候,加载图片多的时候,可
兄弟们好久不见,没想到吧,我胡汉三又回来了,最近一段时间忙于暑期实习上的工作,遇到了很多很想记录下来的问题,但是一直没什么时间,今天终于给我逮到机会了,我先来分享一下在最近工作中遇到的一个很罕见的bug(至少我是这么认为),ok,同样的,我依旧会深入浅出,先简单介绍一些bug生成的环境以及解决bug必须掌握的知识。
认识一下nuxt.js
在这次的项目中,甲方要求我们用服务端渲染数据到页面上,方便后期爬虫爬数据,那么我的老前辈就直接让我使用这个nuxt框架,**Nuxt.js 是一个基于Vue.js的
本来nuxt自带了head() 方法,可以设置路由页面的title, content, keywords, 但是我们项目不知道为什么,有些页面源代码就生成了meta标签,而有些页面就没有,而且发现生成了的页面meta标签在加载css文件之前,没有生成的在加载css文件之后
这个是生成了的
这个是没生成的
虽然找到了一点不同,但是还是没找到原因,如果有知道原因的兄弟可以告诉我一声, 虽然我不知道原因,但是我找到了解决办法
解决办法: nuxt中有一个asyncData方法,可以在里面设置本页面的title,c
小结记录一下,近期碰到的坑。
项目写到一半,字体
图标之前一直是
显示的,在这两天突然全部不
显示了,初步怀疑是改动了代码,把代码还原,依旧
无法显示,各种搜,怀疑框架自带的字体出问题了,看
vuetify官网介绍,字体
图标是框架自带的。无需引入,尝试手动npm再次安装依赖试试,
于是执行官网命令发现,npm命令都
无法识别(问了下朋友,可能这个npm包被删了或者npm包安装指令被修改了)
Windows PowerShell
有很多可能会导致 Nuxt Vite 打包静态文件报错,以下是一些可能的解决方案:
1. 确保你的依赖项是最新的,可以运行 `npm update` 或 `yarn upgrade` 更新依赖项。
2. 检查你的代码是否有语法错误或逻辑错误,可以使用 linter 工具或调试器进行检查。
3. 确保你的配置文件正确,特别是 `nuxt.config.js` 和 `vite.config.js`。
4. 检查你的文件路径是否正确,特别是在引用静态资源时。
5. 确保你的环境变量设置正确,特别是在使用环境变量时。
6. 如果你使用了第三方库,确保它们与 Nuxt Vite 兼容,或者尝试更新它们的版本。
7. 如果你使用了 Nuxt Vite 插件,确保它们与你的 Nuxt 版本和其他插件兼容。
如果你仍然遇到问题,可以尝试在 Nuxt Vite 的官方文档和社区中查找解决方案,或者提交问题报告。
@Bean
public RabbitListenerContainerFactory<?> rabbitListenerContainerFactory(ConnectionFactory connectionFactory){
SimpleRabbitListenerContainerFactory factory = new SimpleRabbitListenerContainerFactory();
factory.setConnectionFactory(connectionFactory);
factory.setMessageConverter(new Jackson2JsonMessageConverter());
factory.setAcknowledgeMode(AcknowledgeMode.MANUAL);
return factory;
python Decimal 保留2位小数
junior_programmer:
python Decimal 保留2位小数
Flying_KU:
nuxt+vuetify项目图标无法显示
junior_programmer:
nuxt+vuetify项目图标无法显示
尧...: