前言 刚接到这个需求的时候,觉得很简单(的确很简单)但是这玩意的坑真的也让人无奈. 网上找了很多的资料,都没有写出痛点(这就很难过了).通过实践并且在我们项目中平稳运行,想分享给后面的人 我的博客上也写了100多篇文章,点击量有上万的也有个位数的,能够帮助到他人这就是写作记录的动力. 需求 vue项目中可以良好展示markdown(只是展示功能 没有编辑功能) 痛点问题 .md文件类型,直接模块加载(只有字符串,这得多难受,怎么维护呢),还是一个文件一个文件的好维护并且好修改复用 用第三方插件,

因公司业务需求,需要做一份订单相关的折线图, 如果其中有一天没有订单的话,这一天就是空缺的,在绘制折线图的时候是不允许的,所有要求把没有订单数据的日期也要在图表显示. 使用技术vue3.0+springboot2.0 ,本次做一个粗略的记录,以便后期查阅和帮助有需要的人. 效果图: 主要展示目的: 当月订单每日的订单数量及每日订单总金额,如当日没有订单 依旧展示日期,且数量和金额均为0. 先来看下主要sql: SELECT sum(money) AS totalMoney, sum(count)

0. 基础要求 了解常见的 ES6 新特性 ES6 的导入导出语法 解构赋值 箭头函数 etc... 了解 vue 2.x 的基本使用 组件 常用的指令 生命周期函数 computed.watch.ref 等 1. 相关资源 [知乎 - Vue Function-based API RFC]https://zhuanlan.zhihu.com/p/68477600 [github - vuejs/composition-api]https://github.com/vuejs/compositi

由于vue3.x还没有正式发布,所以可以通过安装包vue-function-api提前尝试 npm install vue-function-api --save main.js import Vue from 'vue' import { plugin } from 'vue-function-api' Vue.use(plugin) test.vue <template> <div> <span>{{msg}}</span><br> <

9月19日,尤大神发表了VUE3.0版本的演说,强大且震撼,这两天一直在找网站文档,可能还未被百度收录,未找到文档网站.后来在github上面找到了中文代码. 地址为:https://github.com/vuejs/docs-next-zh-cn/ 然后readme.md是这样说的 Vue.js 3.0 中文文档 该站点基于 Vuepress 构建而成.网站内容在 src 文件夹内,格式为 Markdown.欢迎 issue 或 pull request. 英文原版仓库地址:https://g

不要让自己的上限成为你的底线 前言 诈尸更新系列,为了跟上脚步,尝试了vue3,在学习vue3的时候顺便学习一手electron和ts,本教程将分别发布,源码会在最后的文章发布.因为还在开发中,目前也是为了防止有些遇到坑不会及时忘掉,所以先整理一部分出来 将分2部分发出教程,因为配置的东西个人感觉有点多并且跟开发内容相关的东西并不是很多,因此单独发出,见谅,第二篇这两天发出,长文警告!. 开发思路: 页面: 列表页index.vue 头部.搜索.内容部分,只能有一个列表页存在 设置页settin

使用Vue-cli构建Vue3项目 1.检查node版本 node -v 以上node版本位14.15.0满足Vue3项目的创建条件(Vu3需要node 版本8以上) 为什么需要安装node? vue项目需要在node运行环境下进行.VUE项目==文件类型是.vue他是需要被编译成.js文件,才可以被浏览器识别 2.查看npm版本 npm -v npm 是node内置的资源管理器.这里使用淘宝的镜像源 设置镜像源:npm config set registry 查看镜像源: npm config

vue script setup 已经官宣定稿.本文主要翻译了来自 0040-script-setup 的内容. 摘要 在单文件组件(SFC)中引入一个新的 <script> 类型 setup.它向模板公开了所有的顶层绑定. 基础示例 <script setup> //imported components are also directly usable in template import Foo from './Foo.vue' import { ref } from 'vu

Vue3项目搭建规范 一. 代码规范 1.1 集成editorconfig配置 EditorConfig有助于为不同IDE编辑器上维护一致的编码风格 安装插件:EditorConfig for VS Code 后会读取.editorconfig文件 # http://editorconfig.org root = true [*] # 表示所有文件适用 charset = utf-8 # 设置文件字符集为 utf-8 indent_style = space # 缩进风格(tab | space

写在前面 一年多没写过博客了,工作.生活逐渐磨平了棱角. 写代码容易,写博客难,坚持写高水平的技术博客更难. 技术控决定慢慢拾起这份坚持,用作技术学习的阶段性总结. 返回阅读列表点击 这里 开始 大前端时代,最近在面试前端工程师的过程中,有感而发,技术更新迭代快,学习成本高.浏览了各大博客论坛,千差万别,比较混乱.最终决定参考 Element UI 的设计风格,主题色选择紫色(受到 MaterialDesignInXamlToolkit 的影响),写一套基于 Vue3 的 UI 框架库和对应的官

简单使用 创建项目 vue-cli创建 $npm install -g @vue/cli $vue --version @vue/cli 4.5.15 $vue create my-project 然后的步骤: Please pick a preset 选择 Manually select features Check the features needed for your project 选择上TypeScript,特别注意点空格是选择,点回车是下一步 Choose a version of

第一次用 vue3.0 ,发现没有vue.config.js  ,只有一个babel.config.js 怎么办? 需要在根目录手动添加一个即可,如下 相关的配置说明 module.exports = { devServer: { open: true, // 自动打开浏览器 hot: true, // 实时打包编译 host: '0.0.0.0', inline: true, // 表示实时刷新浏览器 port: '8020' // 指定打开浏览器的端口号 } } // module.expo

脚手架安装与卸载 安装 npm install -g vue-cli //or npm install -g @vue/cli 卸载 npm uninstall -g vue-cli //or npm uninstall -g @vue/cli 桥接工具 npm install -g @vue/cli-init vue项目创建 vue 2.0 项目创建 vue init webpack projectname vue 3.0 项目创建 vue create projectname 运行项目 cd

提起帮助文档,想必大家都会想到 VuePress等,我也体验了一下,但是感觉和我的思路不太一样,我希望的是那种可以直接在线编辑文档,然后无需编译就可以直接发布的方式,另外可以在线写(修改)代码并且运行的效果. VuePress 是"静态网站生成器",需要我们自行编写文档,然后交给VuePress变成网站,VuePress 并没有提供编写环境,我知道有很多编写 Markdown 的方式,但是我还是喜欢编写.浏览合为"一体"的方式. 似乎没有,那么 -- 自己动手丰衣足

项目简介 vue3-element-admin 是基于 vue-element-admin 升级的 Vue3 + Element Plus 版本的后台管理前端解决方案,是 有来技术团队 继 youlai-mall 全栈开源商城项目的又一开源力作. 项目使用 Vue3 + Vite2 + TypeScript + Element-Plus + Vue Router + Pinia + Volar 等前端主流技术栈,基于此项目模板完成有来商城管理前端的 Vue3 版本. 本篇先对本项目功能.技术栈进

前置准备 一台电脑 vscode pnpm vscode插件:ESLint v2.2.6及以上 vscode插件:Prettier - Code formatter v9.5.0及以上 vscode插件:Vue Language Features (Volar) v0.39.4及以上 一:新建vue3项目 运行如下命令: pnpm create vite 模板选择vue.vue-ts 二:配置依赖包 修改项目根目录的package.json的scripts和devDependencies如下 "

Vue3 使用v-md-editor如何动态上传图片了 前端代码: <v-md-editor :autofocus="true" v-model="blog.content" height="510px" placeholder="请输入内容" left-toolbar="undo redo clear | h bold italic strikethrough quote | ul ol table hr |

今天看到一篇文章中提到了一个好用的工具release-it.刚好可以用在我正在开发的vue3组件库.纸上得来终觉浅,绝知此事要躬行,说干就干,下面就介绍如何将release-it应用到实际项目中,让组件库可以自动化发布.管理版本号.生成 changelog.tag等 项目调整 在使用这个工具之前先对组件库进行进行一些调整,这里仅是对项目本身的优化和release-it无关. 首先修改vite.config.ts将打包后的目录dist更改为kitty-ui 自动打包中的删除打包文件改成nodejs

1 yyg-cli 是什么 yyg-cli 是优雅哥开发的快速创建 vue3 项目的脚手架.在 npm 上发布了两个月,11月1日进行了大升级,发布 1.1.0 版本:支持创建 vue3 全家桶项目和 vue3 组件库项目.具体如下: vue3 全家桶项目 使用 yyg-cli 创建的 vue3 全家桶项目,底层基于优雅哥编写的开源项目 vue3-vite-archetype,默认整合如下库: - vite3.vue3 - typescript.tsx - vue router - pinia

上文已经搭建了 pnpm + monorepo 的基础环境,本文对 workspace-root 进行初始化配置,包括:通用配置文件.公共依赖.ESLint. 1 通用配置文件 在项目 根目录 下添加下面的配置文件. 添加 .editorconfig 编辑器格式配置文件 [*.{js,cjs,ts,jsx,tsx,vue,html,css,scss,md}] indent_style = space indent_size = 2 trim_trailing_whitespace = true

一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.Vue是框架而jQuery则是库. 1.2.MVC(Model View Controller) 1.2.1.MVC 是什么? MVC是模型(model)-视图(view)-控制器(controller)的缩写,是一种软件设计典范.它是用一种业务逻辑.数据与界面显示分离的方法来组织代码,将众多的业务逻辑聚集到一个部件里面,在需要改进和个性化定制界面及用户