На прошлой неделе, после того, как я закончил свою задачу, я просмотрел статью, в которой рассказывается, как создать расширение для Chrome, я решил узнать, как это сделать, когда обнаружил, что для этого нужны лишь некоторые знания html, css, js. Хорошо, начнем!

  1. Настройка среды разработки

Мы выбираем vue-cli для запуска нашего проекта для его удобства.

npm install -g @vue/cli
# or
yarn global add @vue/cli
vue create my-project

Мы можем добавить такие модули, как TypeScript, Vuex, Vue-router, Linter, Test и так далее.

Папка нашего проекта выглядит так:

2.Приложите некоторые усилия, чтобы следовать спецификации Chrome.

Сначала нам нужно обновить наш manifest.json, чтобы добавить некоторые специальные свойства, от которых зависит хром.

Например, как указано выше, версия — это версия нашего расширения, разрешения содержат необходимые нам разрешения. фон сообщает расширению, на какой файл ссылаться и как этот файл должен себя вести. page_action будет отображать внешний вид расширения.

Теперь давайте закончим background.js. После установки расширения и при выполнении некоторых условий оно будет выполнять действия, которые мы объявили ранее. Подробнее здесь!

Еще одно дополнение, я обнаружил, что среда расширения не поддерживает встроенный скрипт, может быть, я ошибаюсь, но после того, как я настроил vue.config.js, он у меня заработал.

После сборки npm run исходные коды могут выглядеть следующим образом:

3. Локальный тест

Перейдите в раздел chrome://extensions, нажмите кнопку Загрузить распакованное расширение , выберите папку /dist, после чего значок появится в правом верхнем углу расширения площадь. Щелкните значок, чтобы проверить содержимое, если оно соответствует тому, которое мы разработали.

4. Загрузить в магазин

Я думаю, что официальный документ полезнее моих бледных слов.

Я думаю, что писать блоги сложнее, чем программировать, но если я смогу помочь кому-то найти забавную разработку расширения для Chrome, я буду счастлив весь день!

Наконец-то мое первое расширение теперь доступно в магазине, попробуй или просто проигнорируй.