总结一下看文件的顺序 package.json:找到dev,“dev”: “rollup -w -c scripts/config.js --sourcemap --environment TARGET:web-full-dev”,两个重要信息 1.配置文件是scripts/config.js,2.在配置文件中找web-full-dev项 打开scripts/config.js,找到web-full-dev,就知道了入口文件是web/entry-runtime-with...
<el-input v-model="inputValue"></el-input>中inputValue的值,而是希望输入完成后再改变,所以需要特殊处理,我们来看 handleComposition的源码,注意这里只写了一个方法而不是3个,通过event.type来判断事件类型从而简化代码,可以借鉴 handleComposition(event) { if (event.type === 'compositionend') { this.is...
composition-api文档地址:https://composition-api.vuejs.org/zh/ clone项目后看一下package.json 项目很贴心的准备了install方法,这里建议配置一下yarn的淘宝镜像,然后执行这个脚本。 Button组件 文件地址:element-plus\packages\button\src\button.vue 万事开头难,第一个组件看个最简单的button组件 代码段:template ...
这部分在一个单独的包 @element-plus/build,代码位于 /internal/build。 使用到的工具有:rollup、unbuild、esbuild、gulp、ts-morph、fast-glob 等。如需深度理解,建议先自行了解这些包后阅读本章节。 目录结构 源码 internal/build ├── build.config.ts # unbuild 配置文件├── dist # 构建产物├── ...
element-plus 是一个使用 TypeScript + Composition API 重构的全新项目 TypeScript 开发 Composition API 降低耦合,简化逻辑 Teleport 新特性重构挂载类组件 Vue 2.0 全局 API 切换为 Vue 3.0 实例API 组件库和样式打包 使用Lerna 维护和管理项目 Typescript 相关 ...
element-plus: 只有控制到页面上行为的函数就存在于vue文件中,其他逻辑处理函数,都在ts文件中 取值和监听值变化,不使用watch constcheckedValue = computed<CascaderValue>({get() {returncloneDeep(props.modelValue)asCascaderValue},set(val) {emit(UPDATE_MODEL_EVENT, val)emit(CHANGE_EVENT, val)if(props.vali...
1. 从github上克隆代码到本地 git clone https://github.com/element-plus/element-plus.git 2. 安装pnpm npm install pnpm -g 3. 使用pnpm安装依赖包 pnpm i 4. 安装好以后运行项目 pnpm ru
element-plus的源码采用了Monorepo的项目管理方式,将所有的组件都集中在一个仓库中进行统一管理,使得整体的代码结构更加清晰和统一。 1. packages目录 packages目录是element-plus的核心代码目录,其中包含了所有的组件源码和公共代码,每个组件都以单独的文件夹的方式进行组织。 2. examples目录 examples目录包含了element-pl...
昨日探讨了input组件的使用及编码准则，今日深入剖析element-plus源码，探索新知识。文件定位至element-plus\packages\dialog\src\index.vue 先看模板代码片段，引入了teleport组件，这是新增的内置组件。没有使用teleport时，元素作为app组件的子节点；而使用teleport后，元素变为app组件的同级节点，统一挂载于...