演示库作用于组件开发过程的各种调试，开发人员可以直观查看组件库的开发效果。3.2节已经定义的examples目录为演示库的包，所以在使用vite脚手架构建演示库项目时，可以直接执行指令：npm create vite@latest examples，指令中的examples是自定义的演示库目录，如图3-6所示。
图3-6 安装vite脚手架
如果你的电脑没有安装过Vite，会出现Need to install the following packages：create-vite@4.4.1，也就是提示你需要先安装Vite，可直接按 “回车”键即可。如果有安装过，则会跳过这一步。
-
选择开发框架
选择Vue框架，并采用Vue3+Setup语法糖开发，并且使Vue3.4版本开发，如图3-7所示。
图3-7 选择开发框架
-
选择开发技术
这里将选择JavaScript。原因在于使用JavaScript开发组件库相对于TypeScript来说门槛比较低，如果不会TypeScript，在开发过程中会有很多知识看不明白，因此先使用JavaScript开发出组件库后再使用TypeScript再次开发，不但可以提升组件库开发的思路，还可以更加熟悉组件库，如图3-8所示。
图3-8 选择JavaScript开发技术
-
完成渲染库构建
成功构建后可以看到Done。再执行cd examples进入目录，接着执行npm install安装依赖包，如图3-9所示。依赖包安装完成后便可执行npm run dev运行演示库，如图3-10所示，到此便完成了演示库的构建以及演示包的结构目录。
图3-9 运行examples演示包
图3-10 examples演示包目录
