前言 📝
大家需要先有一个自己的github账号,并且要简单熟悉一下vue的语法。
github账号申请:github.com/signup?ref_…
vue3官网:cn.vuejs.org/guide/intro…
过年那段时间,博主闲来无事想写一个vue3的项目玩一玩。在写vue3项目的时候,找到了一个给组件命名的工具库==unplugin-vue-setup-extend-plus==。简单介绍一下如何使用:
- 找到
vite.config.ts文件
// name->setup
import vueSetupExtend from 'unplugin-vue-setup-extend-plus/vite'
export default defineConfig({
plugins: [
vueSetupExtend({
enableAutoExpose: true
}),
],
})
- 找到
main.ts文件
import autoExpose from 'unplugin-vue-setup-extend-plus/dist/client/index'
- 使用
<script setup lang="ts" name="HomeView">
</script>
但是,就是第二步引入文件的时候官方奖励了我一个大大的红色波浪线。
提示的很明显了,就是我们没有导入对应的ts声明类型。
小编刚开始怎么解决的问题呢?
我是在自己的本地项目中,把他node_moduls下面的类型声明导入进来了。
找到项目中的ts配置文件
{
"extends": "@vue/tsconfig/tsconfig.dom.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue", "auto-imports.d.ts"],
"exclude": ["src/**/__tests__/*", "node_modules"],
"compilerOptions": {
"composite": true,
"noEmit": true,
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"],
// 这是找到了node_modules下面unplugin-vue-setup-extend-plus工具库打包之后生成的ts声明文件
"unplugin-vue-setup-extend-plus/*": ["node_modules/unplugin-vue-setup-extend-plus/*"]
}
}
}
但是这样解决并不是很好啊,于是小编决定是看看源码。怀着激动的心情去打开了源码,结果看不懂哈哈哈。不过还好,小编知道这块如何去改。这块不是什么功能型的问题,我还是可以简单解决一下的。接下来就让我们一起看看如何给源码做贡献把。
1. 将项目fork到本地仓库
2. 将fork到仓库的项目克隆到本地
3. 运行项目+代码更改
4. 将项目推送到我们的仓库
5. 提交Pull Request
按照模板提交填写本次提交的内容