#AI編程助手哪家好？DevChat“真”好用 #
前言
我們都有過(guò)寫代碼時(shí)反復(fù)看了半天也不知道bug在哪，大大浪費(fèi)了時(shí)間。一些基礎(chǔ)的代碼可能看一會(huì)兒能夠解決，但是復(fù)雜的代碼就要花上一二個(gè)小時(shí)去檢查，甚至更久。如果有個(gè)AI工具，可以幫助我們搞定基礎(chǔ)代碼，復(fù)雜的邏輯給我們提供給邏輯，那豈不是更好啦。本文給大家介紹一款VS Code AI輔助工具-DevChat，開發(fā)效率直接翻倍！
DevChat介紹
DevChat 是一個(gè)集成了多種主流大模型的 AI 編程工具,專注于提升程序員的編程效率。它整合了ChatGPT等熱門 AI 應(yīng)用,支持自然語(yǔ)言編程、代碼編寫、代碼生成、代碼補(bǔ)全等功能。Devchat 最大的優(yōu)勢(shì)是一站式服務(wù),集成熱門大模型，并且可以根據(jù)需求隨心切換，省去了選擇和整合不同AI模型的麻煩，無(wú)需過(guò)多配置就可以快速上手,從而全面提升開發(fā)效率。
產(chǎn)品務(wù)實(shí)高效，近期還在2023QCon全球軟件大會(huì)亮相，斬獲眾多圈內(nèi)開發(fā)者的好評(píng) |
DevChat 獨(dú)特優(yōu)勢(shì)
DevChat 兼容多種主流大模型，多種模板快速響應(yīng)，不用糾結(jié)AI編程助手哪家好，大模型包括GPT-4 8k/32k、GPT-3.5 4k/16k、Claude2、文心一言、星火、ChatGLM、Code Llama等；可根據(jù)需求選擇代碼片段進(jìn)行AI咨詢。所以DevChat AI輔助工具對(duì)開發(fā)者提高工作效率真的很有幫助，具體優(yōu)勢(shì)如下：
1、多種大模型任意選。復(fù)雜任務(wù)非 GPT-4 莫屬，簡(jiǎn)單任務(wù)交給低成本模型，組合使用效能最佳。
2、精準(zhǔn)的“上下文”管理。對(duì)上下文的精確控制是有效使用人工智能的關(guān)鍵。DevChat 將控制權(quán)交給用戶，以實(shí)現(xiàn)真正的生產(chǎn)力，并提供用戶友好的方法來(lái)簡(jiǎn)化上下文選擇。
3、上手簡(jiǎn)單。您不必學(xué)習(xí)特定編程語(yǔ)言的新框架來(lái)擴(kuò)展人工智能以滿足您的需求。 提示應(yīng)該對(duì)用戶可見(jiàn)且易于編輯，而不是隱藏在復(fù)雜的框架中。您不需要復(fù)雜的框架來(lái)讓人工智能為您服務(wù)。所需要的只是一個(gè)在您的文件系統(tǒng)上運(yùn)行的標(biāo)準(zhǔn)編輯器。
4、實(shí)用。利用人工智能編碼能力的瓶頸在于如何在提示中嵌入正確的上下文，僅當(dāng)人工智能真正增加價(jià)值時(shí)才使用它。
5、簡(jiǎn)單可擴(kuò)展的提示詞目錄。開放提示詞擴(kuò)展，Prompts as Code，滿足團(tuán)隊(duì)和個(gè)人自定義需求。
6、靈活的 Prompt 模板管理，ask-code功能解答代碼庫(kù)的各類問(wèn)題。
7、產(chǎn)品設(shè)計(jì)務(wù)實(shí)，迭代反饋快。
8、代碼和文檔自由生成，而非簡(jiǎn)單補(bǔ)全。
9、對(duì)接微軟 Azure 服務(wù)，可信賴的企業(yè)級(jí)數(shù)據(jù)安全。
官方地址：https://meri.co/tvy
注冊(cè)賬號(hào)
DevChat賬號(hào)注冊(cè)地址：鏈接直達(dá)，注冊(cè)之后發(fā)送到郵箱的key，注意保存下來(lái)，在安裝插件之后需要用到。
安裝插件
打開VS Code開發(fā)工具，在應(yīng)用市場(chǎng)搜索DevChat，然后點(diǎn)擊install
安裝完之后就可以在側(cè)邊欄有個(gè)類似小兔子圖標(biāo)，點(diǎn)擊之后就可以看到插件的視圖。
設(shè)置密鑰訪問(wèn)
插件需要密鑰訪問(wèn)，密鑰是在注冊(cè)時(shí)發(fā)送到郵箱里的。
在 Visual Studio Code 中按 ??P / Ctrl+Shift+P 或 F1 打開命令面板。接下來(lái)，輸入devchat access key并輸入上面的訪問(wèn)密鑰。注意不要忘記安裝Python 3.8+和Git來(lái)使用 DevChat。
然后輸入郵箱里的key就可以啦
之后就可以正常使用啦！
指令
DevChat提供了下面的指令，方便了我們?cè)陂_發(fā)時(shí)的操作以及對(duì)代碼的分析。
- 自定義本地命令
單擊此項(xiàng)并輸入您想要的命令以運(yùn)行。返回將被添加到上下文中。 - git diff --cached
自上次提交以來(lái)已暫存的更改 - git diff HEAD
自上次提交以來(lái)的所有更改 - git log for release note
自指定提交以來(lái)的格式化提交歷史記錄 - symbol definitions
在所選代碼中查找類、函數(shù)等的相關(guān)定義 - symbol references
查找引用所選符號(hào)（類、函數(shù)、變量等）的代碼站點(diǎn)
比如我要用symbol references分析下面的代碼：
let transAudioData = {
transcode(audioData) {
let output = transAudioData.to16kHz(audioData)
output = transAudioData.to16BitPCM(output)
output = Array.from(new Uint8Array(output.buffer))
self.postMessage(output)
// return output
},
選擇symbol references之后，可以看到控制臺(tái)中的OUTPUT輸出一段JSON。
將圖中的字符串轉(zhuǎn)JSON之后如下：
{
"languageId": "javascript",
"path": "../study-demo/kedaxunfei/src/until/transcode.worker.js",
"startLine": 6,
"content": " transcode(audioData) {\r\n let output = transAudioData.to16kHz(audioData)\r\n output = transAudioData.to16BitPCM(output)\r\n output = Array.from(new Uint8Array(output.buffer))\r\n self.postMessage(output)"
}
AI 解疑
DevChat提供了圖中8種AI模型，根據(jù)需求選擇其中一種進(jìn)行對(duì)話操作。
選擇GPT-3.5模型，然后向DevChat輸入需求：手寫Promise，讓其幫助我們進(jìn)行解答。DevChat回答如下：
下面是回答的全部代碼，可見(jiàn)回答的十分詳細(xì)。
enum PromiseStatus {
Pending = 'pending',
Fulfilled = 'fulfilled',
Rejected = 'rejected'
}
class MyPromise<T> {
private status: PromiseStatus;
private value: T;
private reason: any;
private onFulfilledCallbacks: ((value: T) => void)[];
private onRejectedCallbacks: ((reason: any) => void)[];
constructor(executor: (resolve: (value?: T) => void, reject: (reason?: any) => void) => void) {
this.status = PromiseStatus.Pending;
this.value = undefined;
this.reason = undefined;
this.onFulfilledCallbacks = [];
this.onRejectedCallbacks = [];
const resolve = (value?: T) => {
if (this.status === PromiseStatus.Pending) {
this.status = PromiseStatus.Fulfilled;
this.value = value;
this.onFulfilledCallbacks.forEach(callback => callback(this.value));
}
};
const reject = (reason?: any) => {
if (this.status === PromiseStatus.Pending) {
this.status = PromiseStatus.Rejected;
this.reason = reason;
this.onRejectedCallbacks.forEach(callback => callback(this.reason));
}
};
try {
executor(resolve, reject);
} catch (err) {
reject(err);
}
}
then<U>(onFulfilled?: (value: T) => U | PromiseLike<U>, onRejected?: (reason: any) => U | PromiseLike<U>): MyPromise<U> {
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
onRejected = typeof onRejected === 'function' ? onRejected : reason => { throw reason };
const promise = new MyPromise<U>((resolve, reject) => {
const handleFulfilled = (value: T) => {
try {
const result = onFulfilled!(value);
if (result instanceof MyPromise) {
result.then(resolve, reject);
} else {
resolve(result);
}
} catch (err) {
reject(err);
}
};
const handleRejected = (reason: any) => {
try {
const result = onRejected!(reason);
if (result instanceof MyPromise) {
result.then(resolve, reject);
} else {
resolve(result);
}
} catch (err) {
reject(err);
}
};
if (this.status === PromiseStatus.Pending) {
this.onFulfilledCallbacks.push(handleFulfilled);
this.onRejectedCallbacks.push(handleRejected);
} else if (this.status === PromiseStatus.Fulfilled) {
setTimeout(() => {
handleFulfilled(this.value);
}, 0);
} else if (this.status === PromiseStatus.Rejected) {
setTimeout(() => {
handleRejected(this.reason);
}, 0);
}
});
return promise;
}
catch<U>(onRejected: (reason: any) => U | PromiseLike<U>): MyPromise<U> {
return this.then(undefined, onRejected);
}
static resolve<U>(value?: U | PromiseLike<U>): MyPromise<U> {
return new MyPromise<U>(resolve => resolve(value));
}
static reject<U>(reason?: any): MyPromise<U> {
return new MyPromise<U>((_, reject) => reject(reason));
}
static all<U>(promises: (U | PromiseLike<U>)[]): MyPromise<U[]> {
return new MyPromise<U[]>((resolve, reject) => {
const results: U[] = [];
let count = 0;
const handleResolve = (value: U, idx: number) => {
results[idx] = value;
count++;
if (count === promises.length) {
resolve(results);
}
};
promises.forEach((promise, idx) => {
if (promise instanceof MyPromise) {
promise.then(value => handleResolve(value, idx), reject);
} else {
handleResolve(promise, idx);
}
});
});
}
static race<U>(promises: (U | PromiseLike<U>)[]): MyPromise<U> {
return new MyPromise<U>((resolve, reject) => {
promises.forEach(promise => {
if (promise instanceof MyPromise) {
promise.then(resolve, reject);
} else {
resolve(promise);
}
});
});
}
}
當(dāng)然，如果我們?cè)诰庉嬈髦杏胁糠执a有疑惑，可以右鍵選擇Add to AddChat，然后在左側(cè)對(duì)話框輸入我們的問(wèn)題。比如，編輯器中我對(duì)下面的代碼有疑惑，然后詢問(wèn)DevChat幫我解答疑惑。
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
'components': path.resolve(__dirname, 'src/components'),
},
extensions: ['.js', '.json', '.ts', '.vue'], // 使用路徑別名時(shí)想要省略的后綴名，可以自己 增減
},
可以看到當(dāng)點(diǎn)擊Add to AddChat后，左側(cè)輸入框就多個(gè)圖標(biāo)內(nèi)容，主要記錄的是你的操作。
下面是DevChat的回答：
這段代碼是設(shè)置在一個(gè)使用Vite的項(xiàng)目中的路徑別名(alias)和默認(rèn)文件后綴(extensions)的配置。
alias： 這個(gè)屬性允許你創(chuàng)建一些路徑別名，在你引用這個(gè)路徑時(shí)，可以使用別名代替真實(shí)路徑。例如，在此代碼中，‘@’ 代表了 ‘src’
目錄，‘components’ 代表了 ‘src/components’ 目錄。所以如果你在項(xiàng)目中想引用 ‘src/components’
目錄下的 ‘Example.vue’ 文件，你可以這么做：import Example from
‘components/Example.vue’ 或 import Example from ‘@/Example.vue’。extensions： 這個(gè)屬性可以設(shè)置一些默認(rèn)的文件后綴。例如在此代碼中，設(shè)置了 ‘.js’, ‘.json’, ‘.ts’,
‘.vue’ 這幾種文件后綴名，這樣在引用文件時(shí)就可以省略這些后綴了。例如 import Example from
‘@/Example’，系統(tǒng)會(huì)自動(dòng)嘗試加載 ‘src/Example’ + 這些后綴名的文件。這兩個(gè)選項(xiàng)的配置都是用于簡(jiǎn)化路徑引用和提高代碼的可讀性。
DevChat進(jìn)行解答，這種形式不需要我們通過(guò)搜索引擎去搜索問(wèn)題答案，真的是太高效了！文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-727374.html
最后
體驗(yàn)之后，真的感受到人工智能的強(qiáng)大。提高開發(fā)效率是每一位程序猿的綜合素養(yǎng)。在互聯(lián)網(wǎng)降本增效的時(shí)代，希望我們每位程序猿都能順應(yīng)潮流，更高效地工作，減少無(wú)用功，將自身價(jià)值發(fā)揮到有意義的地方！文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-727374.html
到了這里，關(guān)于前端開發(fā)神器之 VsCode AI 輔助插件 DevChat的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
