08 2025 档案
摘要：Webpack 的构建流程可以分为 初始化 → 编译 → 输出 三大阶段，每个阶段又包含若干步骤。 1. 初始化阶段 读取配置文件 Webpack 会读取 webpack.config.js（或 CLI 传参）并合并默认配置。 确定入口 (entry)、输出 (output)、模块规则 (modul
阅读全文
摘要：Webpack 的优势主要体现在 模块化、性能优化、生态完善 和 开发体验 这四个方面。 1. 模块化支持强大 支持多种模块规范 不仅支持 ES6 的 import/export，还支持 CommonJS、AMD 等，解决了浏览器本身不支持这些规范的问题。 资源即模块 不只是 JS 文件，CSS、图
阅读全文
摘要：Webpack 是一个 前端模块打包工具（module bundler），主要作用是把项目中的各种资源（JavaScript、CSS、图片等）当作模块进行处理，然后打包成浏览器可以直接运行的文件。 它解决的核心问题是：现代前端项目模块化开发 和 资源依赖管理。 Webpack 的核心作用 打包模块
阅读全文
摘要：package.json 是 Node.js 项目（包括 Vue、React、Angular 等前端项目）中非常核心的配置文件，主要用来定义项目的元信息、依赖、脚本、运行配置等。 1. 基础信息字段 这些字段描述项目本身的元信息，主要用于文档、包发布。 字段 作用 name 包名（发布到 npm 的
阅读全文
摘要：SCSS 是什么？ SCSS（Sassy CSS）是 Sass 的一种语法风格，它是 CSS 的超集，提供了 CSS 所没有的功能，但最终会被编译成普通 CSS 在浏览器中使用。 特点： 完全兼容 CSS，原来的 CSS 文件可以直接重命名为 .scss 使用。 支持 变量、嵌套、函数、混入、继承
阅读全文
摘要：is 是 Vue 中的一个特殊特性，主要用于 动态组件 和 某些 HTML 标签限制下的组件渲染。 is 特性的作用 动态组件 可以根据变量动态切换渲染哪个组件，而不用写 v-if 一堆判断。 通常搭配 <component> 标签使用： <component :is="currentCompone
阅读全文
摘要：在 Vue 实例中编写生命周期钩子（如 created、mounted、beforeDestroy 等）时，不建议使用箭头函数，原因主要有以下几点： 箭头函数没有自己的 this 箭头函数的 this 是 在定义时静态绑定 到外层上下文的，而不是在调用时动态绑定。 Vue 生命周期钩子需要 this
阅读全文
摘要：Vue.nextTick 的核心作用是 在 DOM 更新完成后执行回调，它的原理和事件循环机制（Event Loop） 以及 微任务（Microtask） 紧密相关。 为什么需要 nextTick？ Vue 的数据更新是异步的，也就是： 当你修改 data 时，Vue 并不会立刻更新 DOM 它会将
阅读全文
摘要：在 Vue 中重置 data 有两种常用方式，可以全部恢复到初始值，也可以只改部分字段。 1. 全部重置到初始值 Vue 组件的 data 是一个函数，它的返回值就是组件的初始状态，所以我们可以重新调用它： resetData() { Object.assign(this.$data, this.$
阅读全文
摘要：在 Vue（尤其是 Vue 2） 中，data 里的数组操作有些方法能直接触发视图更新，有些则不会。 原因是 Vue 2 用的是 基于 Object.defineProperty 的响应式系统，它对数组的方法做了特别的处理，但有些变化检测不到。 可以触发视图更新的数组方法 Vue 2 内部 重写 了
阅读全文
摘要：VNode 和 虚拟 DOM 这两个概念是 Vue（以及 React 等现代框架）渲染机制的核心。 VNode 是什么？ VNode 全称是 Virtual Node，即虚拟节点。 它是一个 用 JavaScript 对象表示的 DOM 节点描述信息。 Vue 在内部会把模板（template）编译
阅读全文
摘要：理解 Vue 的单向数据流，是掌握 Vue 响应式机制和组件通信的基础之一。它可以简要理解为： 什么是单向数据流？ 数据只能从父组件流向子组件，不能反过来。 图示理解： 父组件（Parent） ↓ props 子组件（Child） 父组件通过 props 把数据传给子组件。 子组件不能直接修改从父组
阅读全文
摘要：SPA（Single Page Application，单页面应用）是一种 Web 应用程序的架构模式，它在 首次加载时只加载一个 HTML 页面，后续用户与页面的交互都通过 JavaScript 动态更新视图，而无需重新加载整个页面。 一句话解释： SPA 是用户访问整个网站时，只用加载一次页面，
阅读全文
摘要：在 Vue 中，<style scoped> 的作用是 让样式只作用于当前组件内部，防止样式“污染”其他组件，也防止被其他组件覆盖。 原理简述 当你在 <style> 标签中加上 scoped： <style scoped> .my-box { color: red; } </style> Vue
阅读全文
摘要：在 Vue CLI 创建的标准项目结构中，src/ 目录是项目的核心，它包含了你要开发的主要内容。下面是 src/ 目录下常见的文件和文件夹及其作用： src/ 目录结构及说明 src/ ├── assets/ ├── components/ ├── views/ ├── router/ ├── s
阅读全文
摘要：Vue 页面第一次加载卡顿，常见于项目体积大、组件复杂、资源加载慢的场景。这个问题一般出现在「首屏加载」阶段，主要优化目标是让用户尽早看到内容、尽早可操作。 一、从根本上减轻页面体积 1. 路由懒加载 // 路由配置中使用 import() 动态加载组件 const routes = [ { pat
阅读全文
浙公网安备 33010602011771号