Skip to content

chore(deps): 未使用の jsurl を外し、paper-css をパッケージ名で読む - #58

Merged
ryuuji merged 2 commits into
mainfrom
chore/remove-unused-jsurl
Aug 5, 2026
Merged

chore(deps): 未使用の jsurl を外し、paper-css をパッケージ名で読む#58
ryuuji merged 2 commits into
mainfrom
chore/remove-unused-jsurl

Conversation

@ryuuji

@ryuuji ryuuji commented Aug 5, 2026

Copy link
Copy Markdown
Member

何をしたか

  1. 未使用の jsurl を依存から外した
    knip + depcheck のクロスチェックで未使用と出たもの。リポジトリ全体を検索しても
    package.json / package-lock.json 以外に参照は無い。URL のクエリ組み立ては
    query-string が担っている(src/App.tsx)。

  2. paper-css の読み込みを node_modules 相対パスからパッケージ名に変えた
    @import '../node_modules/paper-css/paper.min.css'@import 'paper-css/paper.min.css'
    index.tsximport 'fomantic-ui-css/semantic.css' と書いているのと同じ流儀に揃えた。
    .css で終わるので sass は plain CSS の @import として素通しし、実際の解決は Vite が行う。

確認したこと

  • npm ci && npm run build が通る
  • 成果物の CSS・JS が変更前と SHA256 まで一致するindex-oVwo4yYR.css / index-DLcc7pV1.js
  • vite dev でも paper-css が展開される(/src/index.sass の応答に .sheet が34件、@import の残留は0件)

検討したが採らなかった案

paper-css の読み込みを index.sass から index.tsx へ移す案(import 'paper-css/paper.min.css')も
試したが、成果物での paper-css の位置が index.sass の後ろへ回ってしまう。
paper-css には @media screen { body { background: #e0e0e0 } } があり、これが index.sass
body { background-color: #ffffff } に勝つため、画面表示の背景が白から灰色に変わる
カスケード順を保つため読み込みは index.sass の先頭に残した。

付随して気づいたこと(このPRでは直していない)

  • src/index.sass 19・20行目の @import './sass/App.sass' / @import './sass/Steps.sass'
    Dart Sass 3.0 で削除される非推奨の Sass @import。ビルド時に DEPRECATION WARNING が出ている。
    どちらの partial も変数・mixin を持たないただの規則集合なので @use への置き換えは容易。
    (1行目の paper-css は plain CSS の @import なので非推奨の対象ではない)
  • vite.config.ts が CommonJS として読まれており、Vite の将来の既定 configLoader: 'native'
    では動かないという警告が出ている。

🤖 Generated with Claude Code

ryuuji and others added 2 commits August 5, 2026 11:29
knip と depcheck のクロスチェックで未使用と判定され、リポジトリ全体を検索しても
package.json / package-lock.json 以外に jsurl の参照は無かった。
URL へのクエリ組み立ては query-string が担っている(src/App.tsx)。

外した前後で vite build の成果物(CSS・JS)が SHA256 まで一致することを確認済み。

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
`@import '../node_modules/paper-css/paper.min.css'` は node_modules の物理的な
位置を決め打ちしていて、index.sass の置き場が変わると壊れる。index.tsx が
fomantic-ui-css を `import 'fomantic-ui-css/semantic.css'` と書いているのと同じく、
パッケージ名から解決させれば十分(.css で終わるので sass は plain CSS の @import
として素通しし、実際の解決は Vite が行う)。

vite build と vite dev の両方で解決されることを確認済み。
成果物 CSS は変更前と SHA256 まで一致する。

なお、この @import を index.tsx 側の `import 'paper-css/paper.min.css'` へ移す案も
試したが、成果物での paper-css の位置が index.sass の後ろへ回り、
paper-css の `@media screen { body { background: #e0e0e0 } }` が index.sass の
`background-color: #ffffff` に勝ってしまう(画面表示の背景が白から灰へ変わる)。
カスケード順を保つため、読み込みは index.sass の先頭に残している。

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
@ryuuji
ryuuji merged commit 32af030 into main Aug 5, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant