Как запустить приложение vue.js внутри скрипта в tampermonkey?

Question

[Larisa Moroz]

Не получается запустить vue.js приложение, скомпилированное через webpack (стандартными средствами vue) в скрипте tampermonkey.

В самом user script-е подгружается только loder.js, который уже загружает chunk-vendors.js и app.js через fetch и выполняет с помощью (new Function(data))();
Скрипты скачиваются, тексты скриптов в консоли вижу, т.е., они успешно загружаются и выполняются.
Если в app.js сделать console.log, он выполняется.

Но в итоге получаю ошибку — Vue is not defined.
window.Vue и window.vue тоже undefined.

Чего делать? Куда смотреть?

З.Ы.: Через внедрение скрипта посредством создания элемента script не получится, так как на целевом сайте сторонние скрипты заблокированы.

Comments

[Alex]

Контекст расширения и контекст окна изолированы друг от друга. Я не вижу кода, но вполне может так быть, что у вас часть работает в одном контексте, а часть в другом. А консоль браузера выводит сообщения и от туда и от туда.

[Larisa Moroz]

Дело не в контексте расширения (песочница или что там ещё)
Такие же приложения не на vue.js , загруженные аналогичным способом, вполне себе работают.

Answer 1

[Larisa Moroz]

В общем, вопрос решился путём изменения настроек Webpack-а, для него надо было в раздел optimization добавить опцию
sideEffects: false для prduction.

И всё заработало, хоть через eval, хоть через подключение скрипта, хоть через внедрение кода скриптов в код страницы.

Answer 2

[profesor08]

import Vue from "vue";

new Vue(...)

Comments

[Larisa Moroz]

ну да, это по умолчанию прописано в main.js

[profesor08]

Larisa Moroz, значит Vue должен быть доступен внутри модуля (файла), в котором он импортирован. И больше нигде.

[acwartz]

profesor08, надо понимать жизненный цикл расширений, потому как обычные страничные скрипты работать могут весьма странным способом. Хром неиспользуемые расширения тупо выгружает из памяти, когда как и за что - не уточняет. Тот же прикол со всякими setInterval, SetTimeout им на замену есть шедулер апи, иначе можно наловить unknown behavior.

[profesor08]

acwartz, жизненный цикл расширений прост и понимается при первой попытке разработать что-то. Если твой код встраивается в страницу, то он будет работать как обычный код на странице. Если твой код запускается в окошке расширения, то он будет работать до тех пор, пока окошко не закроется. Фоновый скрипт будет работать до тех пор, пока он что-то делает, либо что-то слушает.

Конкретно у автора выкидывалось все, что он явно не использовал в коде. Видимо полет сознания и безнаказанности js сделали все дело x_x

[acwartz]

profesor08, ну там вообще интересная ситуация с контекстом в котором выполняемый интегрируемый скрипт))