プログラミング/svelte/VSCodeの準備 の変更点

更新


[[プログラミング/svelte]]

* VS Code + Git Bash + nvm のインストール [#d5c705f1]

https://blog.css-net.co.jp/entry/dev-environment-windows#2-2-Git-for-Windows

に従った。

** VS Code 上の GitBash で nvm が動かない [#tdc757ef]

VS Code を起動中に nvm をインストールすると、

 LANG: console
 $ nvm
 bash: nvm: command not found

とか、

 LANG: console
 $ nvm install lts
 ERROR open \settings.txt: The system cannot find the file specified.

となる。

これは環境変数の更新が VS Code に認識されていないためなので、
VS Code を一旦落として立ち上げなおすと動くようになる。

 LANG: console
 $ node
 bash: node: command not found
 $ nvm list
 
    18.16.0

のような場合は、

 LANG: console
 $ nvm use 18.16.0
 Now using node v18.16.0 (64-bit)
 
 $ nvm list
 
  * 18.16.0 (Currently using 64-bit executable)
 
 $ node
  Welcome to Node.js v18.16.0.

のように nvm use する。

** pnpm を入れる [#dd20e999]

良いうわさを聞くので npm の代わりに pnpm を使ってみる。

- https://pnpm.io/ja/feature-comparison
- タブ補完~
https://pnpm.io/ja/completion
- npx の代わりに pnpm dlx~
https://polidog.jp/2023/01/25/pnpm_dlx/
- pnpmだけを使うようにする~
https://pnpm.io/ja/only-allow-pnpm

 LANG: console
 $ 'npm' install -g pnpm
 
 added 1 package in 6s
 
 $ pnpm install-completion bash
  => Added tabtab source line in "~\.config\tabtab\bash\__tabtab.bash" file
  => Added tabtab source line in "~/.bashrc" file
  => Wrote completion script to C:\Users\osamu\.config\tabtab\bash\pnpm.bash file
  
      => Tabtab source line added to ~/.bashrc for pnpm package.
  
      Make sure to reload your SHELL.

そして ~/.bashrc に、

 alias npm=pnpm

としてしまう。

んーと、、、タブ補完が効いてない気がするのはなぜ???

** VS Code 設定 [#u7dae213]

- フォント Myrica~
https://www.sejuku.net/blog/60345 を参考にした
- テーマファイルについて~
https://coliss.com/articles/build-websites/operation/work/best-of-visual-studio-code-themes.html
- アドオン
-- Japanese Language Pack for Visual Studio Code~
https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-ja
-- Keyboard Macro Beta~
https://marketplace.visualstudio.com/items?itemName=tshino.kb-macro
-- macro-commander (Command Runner)~
https://marketplace.visualstudio.com/items?itemName=jeff-hykin.macro-commander
-- GLSL Lint (WebGL をやる場合)~
https://marketplace.visualstudio.com/items?itemName=dtoplak.vscode-glsllint
-- Shader languages support for VS Code (WebGL をやる場合)~
https://marketplace.visualstudio.com/items?itemName=slevesque.shader
-- ESLint~
https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
-- GitLens — Git supercharged~
https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens
-- npm Intellisense~
https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense
-- Playwright Test for VSCode~
https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright
-- Prettier - Code formatter~
https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
-- Pretty TypeScript Errors~
https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors
-- Prisma~
https://marketplace.visualstudio.com/items?itemName=Prisma.prisma
-- Svelte for VS Code~
https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode



Counter: 411 (from 2010/06/03), today: 2, yesterday: 2