摘要：本文阐述了Nuxt.js作为基于Vue.js的服务器端渲染框架，其在提升Web开发效率、确保代码质量和优化应用性能方面的核心价值。通过详尽的安装步骤、配置说明、常见问题解决策略及进阶部署方法，为开发者搭建和部署Nuxt.js项目提供了全方位指导。 ...

这篇文章介绍了Web Components技术，它允许开发者创建可复用、封装良好的自定义HTML元素，并直接在浏览器中运行，无需依赖外部库。通过组合HTML模板、Shadow DOM、自定义元素和HTML imports，Web Components增强了原生DOM的功能，提高了组件化开发的封装性和... ...

这篇文章介绍了微前端架构概念，聚焦于如何在Vue.js项目中应用Qiankun框架实现模块化和组件化，以达到高效开发和维护的目的。讨论了Qiankun的原理、如何设置主应用与子应用的通信，以及如何解决跨域问题和优化集成过程，从而实现前端应用的灵活扩展与组织。 ...

这篇文章介绍了如何在Vue框架中实现自定义渲染器以增强组件功能，探讨了虚拟DOM的工作原理，以及如何通过SSR和服务端预取数据优化首屏加载速度。同时，讲解了同构应用的开发方式与状态管理技巧，助力构建高性能前端应用。 ...

SoybeanAdmin —— 一个清新优雅、高颜值且功能强大的后台管理模板。基于最新的前端技术栈，包括 Vue3、 Vite5、 TypeScript、 Pinia 和 UnoCSS。 ...

你知道为什么setup语法糖中的顶层绑定可以在template中直接使用的呢？setup语法糖是如何编译成setup函数的呢？ ...

‍ 写在开头 点赞 + 收藏 学会 在后台系统中有一种常见的功能，点击按钮将整个网页全屏，再点击退出全屏。 浏览器提供了2种全屏方式，一种通过API在js中实现，另一种是按F11键进入全屏模式。 但F11进入的全屏模式优先级更高，无法通过API退出。 基本知识 元素全屏 检查可用 ...

‍ 写在开头 点赞 + 收藏 学会 前言 在这之前公司项目的文档预览的方式都是通过微软在线预览服务，但是微软的在线服务有文件大小限制，想完整使用得花钱，一些图片文件就通过组件库antd实现，因为我们项目存在多种类型的文件，所以为了改善用户的体验，决定把文件预览单独弄一个拆出一个项 ...

setup概述 setup是Vue3中新的配置项，值是一个函数，组件中所用到的数据、方法、计算属性、监视等等，均配置在setup中。 setup函数返回的对象中的内容，可直接在模版中使用。 setup中不能使用this关键字，this是undefined。 setup会在beforeCreate() ...

这篇文章介绍了如何在Vue 3项目中配置ESLint和Prettier以统一代码风格，实现代码规范性与可读性的提升。通过设置规则、解决冲突、以及将配置融入持续集成流程和代码审查过程，确保团队协作时代码风格的一致性，提升开发效率与项目维护性。 ...

基于Vue-Cli创建 现在官方推荐使用 create-vue 来创建基于 Vite 的新项目(⚠️ Vue CLI 现已处于维护模式!) # 查看@vue/cli版本号，确保@vue/cli版本在4.5.0以上 vue --version # 没有安装@vue/cil或者版本不在4.5.0以上执行 ...

这篇文章介绍了如何在TypeScript环境下为Vue.js应用搭建项目结构，包括初始化配置、创建Vue组件、实现状态管理利用Vuex、配置路由以及性能优化的方法，旨在提升开发效率与应用性能。 ...

这篇文章介绍了如何使用Vue CLI优化项目构建配置，提高开发效率，涉及配置管理、项目部署策略、插件系统定制以及Webpack和TypeScript的深度集成技巧。 ...

这篇文章介绍了如何在Vue框架中实现数据的高效验证与处理，以及如何集成ECharts、D3.js、Chart.js等图表库优化数据可视化效果。同时，探讨了Progressive Web App(PWA)的接入与优化策略，以提升Web应用的用户体验与加载速度。 ...

这篇文章介绍了如何在Vue.js应用中利用Vue Router实现单页面应用的路由管理，包括配置路由、导航守卫的使用、路由懒加载以优化性能以及动态路由的实现方法，旨在提升用户体验和应用加载效率 ...

一、为什么要安装多个版本的node.js 现在开发前端项目，有的需要node.js版本是18以上的，或者其他版本，然而电脑上安装的是v16，直接升级到18，又怕影响老项目，最好的办法就是安装多个版本，需要哪个切换一下就行。 网上有一些安装多个版本node.js的做法，很麻烦。推荐nvm这个工具，很方 ...

前言 众所周知，vue3的template中使用ref变量无需使用.value。还可以在事件处理器中进行赋值操作时，无需使用.value就可以直接修改ref变量的值，比如：<button @click="msg = 'Hello Vue3'">change msg</button>。你猜vue是在编 ...

typora-root-url: img vue脚手架 1 vue脚手架的概念 Vue脚手架（Vue Scaffolding）是Vue.js**官方提供的一个工具，专门用于快速搭建单页面应用（SPA）的项目结构。它通过命令行界面（CLI）提供了一套标准化的开发流程，包括项目初始化、自动化构建、本 ...

title: Vuex 4与状态管理实战指南 date: 2024/6/6 updated: 2024/6/6 excerpt: 这篇文章介绍了使用Vuex进行Vue应用状态管理的最佳实践，包括为何需要状态管理，Vuex的核心概念如store、actions、mutations和getters，以及 ...

‍ 写在开头 点赞 + 收藏 学会 [webpack由浅入深]系列的内容 第一层: 了解一个小功能的完整流程. 看完可以满足好奇心和应付原理级别面试. 第二层: 源码陪读, webpack源码比较灵活, 自己看容易陷入迷惑. 文章里会贴出关键流程的代码来辅助阅读源码. 如果你正在 ...