AI时代到来,Github Copilot问世
以下是GitHub的首席执行官 Thomas 在2022年6月21日,首次将Github Copilot
面向个人开发者全面开放的公告。
什么是 Github Copilot
简单来说就是能帮助程序员提高代码方面的开发效率,完全展示了作为副驾驶员 ( copilot ) 的导航,协助的能力。
如何使用 Copilot
目前 Github Copilot
是收费的😔,对于个人开发用户也是个不小的开销。当然Github Copilot
也提供了30天的免费试用体验😊,前提是你需要绑定 信用卡 或者 PayPal。
🎉开通成功后,基于VS Code工具
来讲的话。
- 直接登录已开通绑定的github账号
- 在扩展市场下载对应的
Github Copilot
插件 - 等待右下角机器人🤖小图标正常显示时就能使用了。
Copilot 自动化代码生成
简单实现一个案例:点击按钮随机更换背景颜色
没错,差不多只有注释部分就是我手动写的部分。其它部分代码均为ai生成。😮虽然代码部分不是特别完美,但是确实能够实现此功能。
html
<!-- 生成一个垂直水平居中的按钮 -->
<template>
<div class="other">
<div class="btn" @click="changeColor">
<div class="btn-inner">
<div class="btn-inner-inner">按钮</div>
</div>
</div>
</div>
</template>
<!-- 给按钮添加一个点击事件,每次点击按钮,背景颜色就会随机改变 -->
<script>
export default {
data() {
return {
color: '#fff'
}
},
methods: {
changeColor() {
this.color = '#' + Math.floor(Math.random() * 0xffffff).toString(16)
// 背景颜色改变
this.$el.style.backgroundColor = this.color
}
}
}
</script>
<!-- 样式部分 -->
<style lang="scss" scoped>
.other {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
.btn {
width: 200px;
height: 50px;
background: #fff;
border-radius: 5px;
box-shadow: 0 0 10px #ccc;
cursor: pointer;
user-select: none;
.btn-inner {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.btn-inner-inner {
font-size: 20px;
}
}
}
}
</style>
注释生成
通过编写注释,根据注释内容自动生成代码。
- 多用于简单js方法生成
- 简单的css布局样式等
自动填充生成
Copilot可以结合当前项目上下文,编写时会提前帮你 预测 出你想要的代码。
- 编写上半段代码,帮你生成下半段代码,节省 55% 的时间;
- 尤其是在你可能不擅长的领域,这种 预测 方式,可以优先帮你生成代码,然后你再去学习代码。(经常会给人一种意想不到的效果😮)
CopilotChat 聊天机器人
可基于当前项目帮你 分析代码问题,生成代码,优化代码,测试代码等,拥有一个强劲的 在线云助手 (需要梯子加速)
前提是你已经开通了copilot,和copilot chat有绑定的,需要在组织中启用,后续就可以直接使用了。
可能对你有帮助
- 企业版开通copilot,正常编写代码时可以不用梯子,可能有提速。
- 一个github账号开通后,其实可以2-3个人一起用(白嫖的冷知识😄,希望有缘人能看到)。
- 目前
微信小程序开发工具
暂不支持copilot插件使用,所以大家可以等等。 - Github Copilot文档地址
- Github Copilot官网地址
- Github Copilot首次发布公告