開發(fā)背景與最終功能

需要維護(hù)一些老項(xiàng)目，同時(shí)開發(fā)新項(xiàng)目時(shí)，切換nvm很煩人
最終實(shí)現(xiàn)vscode插件：每個(gè)vscode實(shí)例打開一個(gè)項(xiàng)目，切換vscode實(shí)例時(shí)能自動(dòng)切換版本（需要項(xiàng)目根目錄有一個(gè).nvmrc文件）

插件下載

vscode插件市場(chǎng)搜索vscode-nvmrc

設(shè)計(jì)思路

項(xiàng)目根目錄新建.nvmrc文件，這是nvm的官方文件，當(dāng)使用nvm use時(shí)會(huì)自動(dòng)查找這個(gè)文件，而windows系統(tǒng)一般使用的是nvm-for-windows，它是由另一個(gè)開發(fā)者維護(hù)的windows版本，并不支持nvm use查找.nvmrc
不過這并不影響vscode插件中實(shí)現(xiàn)nvm use功能，只不過了解下.nvmrc是nvm的官方文件

話不多說，上代碼，很簡(jiǎn)單，vscode插件方法vscode.window.onDidChangeWindowState中讀取下.nvmrc文件，e.focused表示當(dāng)vscode窗口顯示時(shí)觸發(fā)，切換vscode實(shí)例時(shí)能夠觸發(fā)，然后調(diào)用child_process.exec 運(yùn)行nvm use文章來源地址http://www.zghlxwxcb.cn/news/detail-551518.html

import * as vscode from "vscode";
import { exec } from "child_process";
import { readFile } from "fs";
import { resolve } from "path";

let statusBar: vscode.StatusBarItem | undefined;
let timeout: NodeJS.Timeout;

enum Status {
  error = "error",
}
function customStatusBar(text: string, type?: Status, time = 4000) {
  if (statusBar) {
    statusBar.dispose();
  }
  if (timeout) {
    clearTimeout(timeout);
  }
  statusBar = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Left);
  statusBar.color = "#ffffff";

  if (type === Status.error) {
    statusBar.backgroundColor = new vscode.ThemeColor(
      "statusBarItem.errorBackground"
    );
  }
  if (!type) {
    statusBar.backgroundColor = new vscode.ThemeColor(
      "statusBarItem.warningBackground"
    );
  }
  statusBar.text = "vscode-nvmrc: " + text;
  statusBar.show();
  timeout = setTimeout(() => {
    if (statusBar) {
      statusBar.dispose();
    }
  }, time);
  return;
}

function execute(cmd: string) {
  exec(cmd, (error, stdout, stderr) => {
    if (error) {
      customStatusBar(`${error}`);
    } else {
      if (stderr) {
        customStatusBar(stderr);
      } else {
        customStatusBar(stdout);
      }
    }
  });
}

function nvmuse(url: string) {
  readFile(url, { encoding: "utf8" }, (err, data) => {
    if (err) {
      customStatusBar(".nvmrc file not found.");
      return;
    }
    execute("nvm use " + data);
  });
}

function resolveRootPathAndNvmuse() {
  const workspaceFolders = vscode.workspace.workspaceFolders;
  if (workspaceFolders && workspaceFolders.length > 0) {
    const rootPath = workspaceFolders[0].uri.fsPath;
    if (rootPath) {
      const url = resolve(rootPath, ".nvmrc");
      nvmuse(url);
    }
  }
}

export function activate(context: vscode.ExtensionContext) {
  resolveRootPathAndNvmuse();
  const disposable = vscode.window.onDidChangeWindowState((e) => {
    if (e.focused) {
      resolveRootPathAndNvmuse();
    }
  });
  context.subscriptions.push(disposable);
}

export function deactivate() {}

到了這里，關(guān)于實(shí)現(xiàn)一個(gè)vscode插件：打開多個(gè)vscode項(xiàng)目時(shí)根據(jù).nvmrc文件自動(dòng)切換nvm的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！