小满:课程很赞;
小满zs的博客_CSDN博客-Vue3,typeScript,前端领域博主
第一章介绍 心得:
1、MVVM(Model-View-ViewModel)架构,Vue 的核心库只关注视图层(UI 用户界面)。
2、VUE3新特性:
最棒的一个特性是VDOM性能,VUE2采取全量对比方式,VUE3采取标记对比,提升了渲染性能;介绍 — Vue.js
第二章配置环境 心得:
1-NODEJS安装(引入npm)
2-VITE项目构建(npm init vite@latest安装VITE)
官方文档开始 {#getting-started} | Vite中文网
npm init vite@latest
npm i
npm run dev
第三章 目录和SFC 、 npm run dev心得:
1-静态资源: public 下的不会被编译, assets 下的可编译
2-公共组件:components
3-全局:App.vue+main ts,跟index.html强关联;
4-入口文件:index.html (他刚开始不会编译这些js文件 只有当你用到的时候 如script src="xxxxx.js" 会发起一个请求被vite拦截这时候才会解析js文件)
5-VSCODE插件:Volar、TypeScript Vue Plugin(Volar):特征:
(1)编辑器快捷分割和vite动态预览功能
(2)代码智能提示
6-VUE内的<template>
</template>
内容会传入 @vue/compiler-dom编译器,编译为
JavaScript 的渲染函数,并附属到导出的组件上作为其 render(用于精简冗长重复代码的函数,
return createEement(, {}, [])
)
选项。(参数1:html内容;参数2:dom中的一些样式、属性、传的组件的参数、绑定事件之类;参数3:类型是数组,数组元素类型是VNode,设置分发的内容)
render函数的本质就是创建一个虚拟节点
7-<script setup>,该脚本会被预处理并作为组件的 setup()
函数使用,也就是说它会在每个组件实例中执行
8-<style>可以通过scoped限制局部样式,非全局;
9-npm机制
npm install XX:在node_modules/.bin/下创shell可执行脚本文件;
npm run xxx: npm 会通过软连接 查找这个软连接存在于源码目录node_modules/vite
1. 查找规则是先从当前项目的node_modlue /bin去找,
2.找不到去全局的node_module/bin 去找 npm install -g
3.再找不到 去环境变量去找(3个VITE:unix\windows\跨平台)