Shion のもくログ(旧: Shion の技術メモ)

使った技術のメモや、うまくいかなかった事とかを綴ります

PR

2022/12/24 ~ 2022/12/30 のもくもく日記

もくもく 前回までは

2022/12/17 ~ 2022/12/23 のもくもく日記 をご覧ください。

途中経過

その1

VSCode API でファイルの存在判定、最初stat でファイルサイズを見て判定していたのだけど、これだと空のファイルで上手くいかなかった。

なので親パスを指定してファイル一覧を取得し、その中に該当パスあるかに変えてみたのだけど、これで良いのか不安ではあるw

Before

const stats = await workspace.fs.stat(path)
    .then(x => x, _ => undefiend);
return 0 < (stats?.size ?? 0);

After

const parentPath = Uri.joinPath(path, '..');
return (await workspace.fs.readDirectory(parentPath))
    .map(([filename, _]) => Uri.joinPath(parentPath, filename))
    .some(uri => uri.fsPath === path.fsPath);

その2

てかVSCode API の WebviewPanelSerializer の使い方をミスって、HTML の復元処理をすっかり忘れてたw

https://code.visualstudio.com/api/extension-guides/webview#persistence

その3

指定したパスに属するファイルの羅列を実装してみたのだけど、再帰を使ったので、動いているけどなんか不安w

/**
 * 指定したパス配下にあるファイルURI を羅列する
 *
 * @param uri 捜査対象のパス
 */
public async enumerateUris(uri: Uri) {
  const children = await workspace.fs.readDirectory(uri);

  let candidate: Uri[] = [];
  for (const [path, type] of children) {
    const targetUri = Uri.joinPath(uri, path);
    switch (type) {
      case FileType.Directory: {
        const grandChildren = await this.enumerateUris(targetUri);
        candidate = candidate.concat(grandChildren);
        break;
      }
      case FileType.File:
        candidate.push(targetUri);
        break;
    }
  }
  return candidate;
}

その4

VSCode API のUri がWindows で何か動かない……と思ったのだけど、原因は自前実装したファイルの存在判定がミスっていた説が濃厚になってきたw

その5

HTML で下記のような記述するとES モジュールを読み込める……ブラウザがあるのか👀

<script type=“module” src=“es module js”></script>

その6

自作VSCode 拡張機能のWebView 用のHTML の構築にVue.js 使っていたけど、Svelte も良いかもしれない 👀

その7

ノリでcommonjs 書いていたら、import なのかrequire なのか、export なのかmodule.exports なのかで永遠と迷ってしまうorz

その8

iframe タグのようなサンドボックスで、より軽量な実装のShadowRealm というものが策定中らしい

https://github.com/tc39/proposal-shadowrealm

その9

自作VSCode 拡張機能内で、netlify/build-image をpull してきて、それを実行するようにしてみたのだけど、だいぶ楽になったw

その10

久々にGitHub Actions の各アクションを見てみたのだけど、バージョンアップしていたりして浦島太郎状態……

create-release というGitHub Actions はarchive になってた 👀 雰囲気を察するにgithub-script と言うActions の方に移行する感じかな?

https://github.com/actions/create-release

upload-release-asset もarchive になってた👀 上の返信とかの流れを考えると、github-script に寄せていく……はず

https://github.com/actions/github-script

その11

global install せずに最新のangular cli を使うコマンド例

※とりあえずバージョン表示

npx -p @angular/cli@latest ng version

……昔どなたかのブログで見かけた気がするけど、忘れてしまったので改めてメモw

今回の成果

※関連SNS
PR