サイト整備

shusann01116,•2 min read
blog
Back

サイト整備

最近すっかり寒くなってきましたね。昨晩は寒さで目が覚めてしまいました。

さて、今日はこのブログサイトに関連するメモを残していきたいと思います。

VS Code debug できない問題

Next.js の Debugging (opens in a new tab) ページを参照すると、 何故か shell のシンタックスエラーで弾かれてしまう問題が発生しました。どうやら、 pnpm でインストールすると shell スクリプトになるぽいらしいですが それが原因らしい？(真偽不明)

とにかく、resolve したのでご紹介です。

launch.json の configurations にいれるストラクトを "runtimeExecutable": "sh" のように変更するとうまくいきました。 (ref (opens in a new tab))

{
  "name": "Next.js: debug full stack",
  "type": "node",
  "request": "launch",
  "program": "${workspaceFolder}/node_modules/.bin/next",
  "runtimeExecutable": "sh", <-- ここ
  "env": {
    "NODE_OPTIONS": "--inspect"
  },
  "skipFiles": ["<node_internals>/**"],
  "serverReadyAction": {
    "action": "debugWithChrome",
    "killOnServerStop": true,
    "pattern": "- Local:.+(https?://.+)",
    "uriFormat": "%s",
    "webRoot": "${workspaceFolder}"
  }
}

Tailwind CSS

tailwind (opens in a new tab) の公式サイトより、 next.js (opens in a new tab) の公式サイトの情報が詳しいのでこっちを見たほうがいいよという話です。(global.css どこで読み込むのかわからんみたいな人には結構大きな違いです)

TypeScript paths 問題

やる機会が少ないので毎回忘れてしまうため備忘録も兼ねて、 paths (opens in a new tab) のドキュメントを読むと、以下のようにやってあげると @/components/A/hahaha みたいなノリでいけるので最高

{
  "compilerOptions": {
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

TODO

とりあえずそこくらい、おやすみなさい。

MIT2024 © shusann01116.