v4-components

v3-components

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

Customize configuration

See Configuration Reference.

day2

• 简述 designComponent 意义何在；并且自己手写实现 designComponent 源码，理解其中每一个类型的含义（开始入门了解Vue3.0的类型系统）；
• 总结自己在实现designComponent过程中，对于Vue3.0的类型的理解，并且整理出自己在typescript这一块缺少的知识技能，对哪一块内容不够清晰。
• 使用designComponent函数实现简单的 input、button组件，并通过给出的主题样式文件，实现组件的主题色功能。使用 designComponent 重构 PART01 中的 app-menu, AppNavigator, AppNavigatorPage组件。
• 打包组件，在纯html文件中引入umd文件能够正常使用暴露的对象。将打包好的umd文件以及组件源码src目录发布到npm，新建一个新的vue-cli工程， 在这个新的工程中安装组库，并且能够正确获取组件的类型。
• 新工程中能够按需引入组件。
• 新工程中能够正确配置使用安装的组件库中的主题系统。

安装打包所需要的依赖

npm i autoprefixer@8 babel-loader@8 css-loader@5 mini-css-extract-plugin postcss@8 postcss-loader@4 rollup-plugin-postcss@3 rollup-plugin-terser sass sass-loader@8 ts-loader@8 typescript webpack@4 webpack-cli@4 webpack-merge @rollup/plugin-babel @rollup/plugin-commonjs @rollup/plugin-node-resolve @rollup/plugin-typescript -D