Изменения в импортированных файлах JS с перезагрузкой страницы триггера проекта Vue CLI - PullRequest
Новая
       24

Изменения в импортированных файлах JS с перезагрузкой страницы триггера проекта Vue CLI

1 голос
/ 08 июня 2019

При внесении изменений в любую функцию .js-файл в папке ./src/fn горячая перезагрузка не работает и вызывает перезагрузку страницы.

Я пытался настроить configure vue.config.js, чтобы он правильно включал каталог в HMR. Также я попытался использовать мои собственные помощники в качестве Vue.use (myPlugin). 

/* functions.js (just a part of it) */
export const Functions = {
  game: {
    helper: helpers,
    turn: turn,
    ui: ui,
    validate: validate,
    card: cards
  },
}

/* main.js */
import Functions from './functions.js';
Vue.prototype.$myFn = Functions;

Ожидается, что HMR будет работать, но вместо этого получит полную перезагрузку страницы при внесении изменений в functions.js (или любой основной файл js, импортированный в functions.js)

1 Ответ

1 голос
/ 08 июня 2019

Добавление ваших собственных объектов и функций в прототип Vue - это своего рода анти-паттерн. В этом случае Webpack не может определить степень внесенных изменений, поэтому он возвращается к перезагрузке страницы. Это связано с тем, что модули ES могут подвергаться статическому анализу, а глобальные объекты - нет.

Вот несколько статей о статическом анализе:

Удалите функции из прототипа Vue и всегда используйте ES-модули для структурирования ваших функций. Затем вы можете import перевести их в другие модули или компоненты, не используя устаревший стиль глобального подхода взлома прошлых лет.

...