Блог

Сегодня я создаю новое приложение Rails webpacker с помощью команды:

 $ rails new my-app --webpacker=react -d mysql
 

Новое приложение создавалось плавно, пока я не попытался запустить:

 $ ./bin/webpack-dev-server
 

Интерфейс командной строки webpack возвращает сообщение:

 The command moved into a separate package: @webpack-cli/serve
Would you like to install serve? (That will run yarn add -D @webpack-cli/serve) (yes/NO) :
 

Я попытался выбрать yes , но установка webpack-cli не увенчалась успехом с сообщением:

 success Saved lockfile.
success Saved 1 new dependency.
info Direct dependencies
└─ @webpack-cli/serve@1.5.2
info All dependencies
└─ @webpack-cli/serve@1.5.2
Done in 2.11s.
TypeError: Class constructor ServeCommand cannot be invoked without 'new'
    at runWhenInstalled (/home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
    at /home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:124:15
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
 

и когда я запускаю ./bin/webpack-dev-server команду, я получаю сообщения об ошибках:

 /home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:46
    return func(...args);
           ^

TypeError: Class constructor ServeCommand cannot be invoked without 'new'
    at runWhenInstalled (/home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
    at promptForInstallation (/home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:140:10)
    at /home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/cli.js:32:43
    at Object.<anonymous> (/home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/cli.js:366:3)
    at Module._compile (internal/modules/cjs/loader.js:1072:14)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
    at Module.load (internal/modules/cjs/loader.js:937:32)
    at Function.Module._load (internal/modules/cjs/loader.js:778:12)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
 

Вот мой package.json :

 {
  "name": "my-app",
  "private": true,
  "dependencies": {
    "@babel/preset-react": "^7.14.5",
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "5.4.2",
    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
    "prop-types": "^15.7.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "turbolinks": "^5.2.0",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^4.0.0"
  }
}
 

и мой node.js версия

 $ node -v
v14.17.5
 

На данный момент временно я решаю эту проблему, используя предыдущую версию:

 "devDependencies": {
  "webpack-dev-server": "^3.11.2"
}
 

Обновить:
webpack-cli amp; webpack-dev-server в devDependencies свежей упаковке.json, сгенерированный rails new my-app --webpacker=react с помощью:

 "dependencies": {
  ...
  "webpack-cli": "^3.3.12"
  ...
},
"devDependencies": {
  "webpack-dev-server": "^4.0.0"
}
 

Если мы посмотрим отсюда, мы обнаружили, что webpack-dev-server v.4.0.0 это зависит от "webpack-cli": "^4.7.2" того, что несовместимо с fresh rails webpacker конфигурациями пакетов, которые используют "webpack-cli": "^3.3.12" в качестве зависимостей.

Обычно мы можем проверить webpack-cli информацию, используя команду npx webpack-cli info . Но теперь, когда я пытаюсь, я получил ошибку и обнаружил предупреждение:

 $ npx webpack-cli info
...
warning " > @webpack-cli/info@1.3.0" has incorrect peer dependency "webpack-cli@4.x.x".
...
TypeError: Class constructor InfoCommand cannot be invoked without 'new'
    at runWhenInstalled (/home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
    at /home/yohanes/Projects/my-app/node_modules/webpack-cli/bin/utils/prompt-command.js:124:15
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
...
 

На данный момент единственные конфигурации, которые работают только с моей средой:

 "dependencies": {
  ...
  "webpack-cli": "^3.3.12"
  ...
},
"devDependencies": {
  "webpack-dev-server": "^3.11.2"
}
 

Обновить:
Пожалуйста, смотрите комментарий DHH здесь

Дело закрыто.