Импорт файлов из веб-пакета без расширения некорректно изменяется в HMR (горячая замена модуля)

Question

Импорт файлов из веб-пакета без расширения некорректно изменяется в HMR (горячая замена модуля)

1

Я следую этому руководству и пишу код, как это руководство. Все отлично! Но когда я изменяю import printMe from './print.js' чтобы import printMe from './print', HMR не выводит изменения правильно!

Когда я изменяю, как print.js в print.js:

   export default function printMe() {
 -   console.log('I get called from print.js!');
 +   console.log('Updating print.js...')
   }

Консоль должна выводиться: Обновление print.js...

Но он выводит: меня вызывают из print.js!

Когда я изменил sencond "Обновление print.js..." на "Обновление print.js снова...", он не изменяет.

Ниже приведен мой снимок:

Тем не менее, в модуле Resolution сказано:

Если путь имеет расширение файла, то файл сразу связывается.

В противном случае расширение файла разрешается с помощью параметра resolve.extensions, который сообщает распознавателю, какие расширения (например,.js,.jsx) приемлемы для разрешения.

и разрешения-расширения также говорят:

Автоматически разрешать определенные расширения. Это значение по умолчанию:
extensions: [".js", ".json"]

Итак, мой вопрос: не может ли webpack разрешить путь без расширения, как то, что он говорит выше? Это ошибка или что я делаю неправильно? То, что я сделал, это просто изменить import printMe from './print.js' чтобы import printMe from './print'.

Моя среда:

узел v7.4.0
npm 4.0.5
webpack 3.4.1
webpack-dev-server 2.6.1
macOS Sierra 10.12

Большое спасибо!!

Sam Yang 31 июль 2017, в 14:52

Источник

Теги:

javascript

webpack

webpack-dev-server

hot-module-replacement

1 ответ

Ещё вопросы

Sam Yang · Accepted Answer · 2017-08-05T07-02-00.000Z

Полагаю, я знаю, почему он работает неправильно.

Что я делаю:

SRC/index.js

import _ from 'lodash';
import printMe from './print';

// ...

if(module.hot) {
  module.hot.accept('./print.js', function() {
    console.log('Accepting the updated printMe module!');
    printMe();
  });
}

Но вы всегда должны указывать имя import и первый параметр module.hot.accept быть одинаковым:

SRC/index.js

import _ from 'lodash';
import printMe from './print';

// ...

if(module.hot) {
  module.hot.accept('./print', function() {
    console.log('Accepting the updated printMe module!');
    printMe();
  });
}

ИЛИ ЖЕ:

SRC/index.js

import _ from 'lodash';
import printMe from './print.js';

// ...

if(module.hot) {
  module.hot.accept('./print.js', function() {
    console.log('Accepting the updated printMe module!');
    printMe();
  });
}

Все эти две ситуации работают. Это может быть ожидаемое поведение авторов webpack. Но, с моей точки зрения, все три ситуации должны были работать. :(