vite使いたくない？使いたいよね？使うか。
どうしてVite？
- ホットリロードがしたいから
- 以前使った時、使い心地が良かったから
手順
1 . viteのインストール
npm init vite@3.0.0
プロジェクト名 ： 好きな名前
フレームワーク： React ＋ TS
2 . 各種パッケージのインストール
cd <プロジェクト名> npm install vite@latest
npm i -D @crxjs/vite-plugin@2.0.0-beta.15 npm i @types/chrome
4 . 実行してみる
npm run dev
- distというディレクトリが生成されるのを確認
- Chromeを起動し、右上メニューからその他のツール→拡張機能
- 右上の「デベロッパーツール」を有効化し、左上の「パッケージ化されていない拡張機能を読み込む」
- distを指定する
- 右上の拡張機能アイコンから、新しく追加したヤツをクリックすると、React + viteのデフォルト画面がポップアップする
EX: Content-Scriptを実行する
このリンクの、「Implementation for React 18+」を参考にしながらコードを変更する
