5000164 is here
My writing is my life.
No results for undefined
Powered byAlgolia
Wikipedia のモバイル版を表示する Chrome 拡張機能を作った

Wikipedia はモバイル版の方が見やすいと思うのでモバイル版を表示する拡張機能を作った。
ソースはこちら。

作り始める

Chrome 拡張機能の作り方がわからなかったので調べていたらドットインストールがあったのでここで勉強。

概要を把握。
思ってたよりさっくり作れそう。

TypeScript を使いたい

TypeScript を試したかった。
npm で TypeScript をインストールして PhpStorm で自動コンパイルするところまではすぐできた。
でも Chrome の API を認識させることができなくて困った。
ライブラリをダウンロードすればいけるよって書いてあったけど、それだけだと chrome なんてないよと怒られてしまう。
だから手動でインストールしてパスを通したら、今度は定義が複数あるって言われた。
最終的に、PhpStorm 側でダウンロードしたものを消して、tsd でダウンロードしたやつを PhpStorm 側に設定することで落ち着いた。

ver. 1

特定のページに来た時に動作すればいいんだから content_scripts でいけるだろと思って実装した。
なんか preRequest イベントってのがあるからそれ使いたい。
でも動かなかった。
うまく動かせなかったので諦めて location.href でモバイル版にリダイレクトさせていた。
ださい。

ver. 2

落ち着いて考えたら content_scripts はどうやらページが表示された後に動作する気配がある。
ってことは background にすれば preRequest 使えるんじゃないだろうかという仮説。
やってみたら使えた。
ということでアクセスする URL を確認して Wikipedia だったらそのままモバイル版を表示する拡張機能ができた。

参考