1

Estou tentando criar minha primeira aplicação ReactJS.

Quando executo no terminal bash do VSCode o seguinte comando:

yarn webpack-dev-server --mode development

Aparece o seguinte erro:

$ yarn webpack-dev-server --mode development
yarn run v1.22.10
$ C:\tools\Cmder\react\node_modules\.bin\webpack-dev-server --mode development
node:internal/modules/cjs/loader:928
  throw err;
  ^

Error: Cannot find module 'webpack-cli/bin/config-yargs'       
Require stack:
- C:\tools\Cmder\react\node_modules\webpack-dev-server\bin\webpack-dev-server.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:925:15)
    at Function.Module._load (node:internal/modules/cjs/loader:769:27)
    at Module.require (node:internal/modules/cjs/loader:997:19)    at require (node:internal/modules/cjs/helpers:92:18)       
    at Object.<anonymous> (C:\tools\Cmder\react\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:973:32)   
    at Function.Module._load (node:internal/modules/cjs/loader:813:14)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\tools\\Cmder\\react\\node_modules\\webpack-dev-server\\bin\\webpack-dev-server.js'
  ]
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Já tentei colocar todos scripts no package.json que vi no stackoverflow e já instalei o yarn de diversas formas.

Meu webpack.config.js está assim:

const path = require('path');

module.exports = {
  entry: path.resolve(__dirname, 'src', 'index.js'),
  output: {
    path: path.resolve(__dirname, 'public'),
    filename: 'bundle.js'
  },
  devServer: {
    contentBase: path.resolve(__dirname, 'public'),
  },
  module: {
    rules:[
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader:'babel-loader',
        }
      }
    ]
  }
};
2
  • 1
    Qual versao do webpack-cli você está usando? Commented 15/02/2021 às 13:58
  • $ webpack-cli --version webpack 5.22.0 webpack-cli 4.5.0 webpack-dev-server 3.11.2 Commented 15/02/2021 às 13:59

1 Resposta 1

3

Dependendo da versão do webpack-cli, tem essa issue que explica algumas mudanças que tem que ser feitas de acordo com a versão.

Basicamente para as versões webpack 5.x e webpack-cli 4.x, o script de execução webpack-dev-server deve ser substituido por webpack serve:

For webpack-cli 3.x:

"scripts": {
  "start:dev": "webpack-dev-server"
}

For webpack-cli 4.x:

"scripts": {
 "start:dev": "webpack serve"
}

Trecho de código retirado da issue

Então, você pode testar seu script mudando de:

yarn webpack-dev-server --mode development

para:

yarn webpack serve --mode development
3
  • Testei e apareceu o seguinte erro : $ yarn webpack server --mode development yarn run v1.22.10 $ C:\tools\Cmder\react\node_modules\.bin\webpack server --mode development [webpack-cli] Unknown command or entry 'server' [webpack-cli] Did you mean 'serve' (alias 's')? [webpack-cli] Run 'webpack --help' to see available commands and options error Command failed with exit code 2. Commented 15/02/2021 às 14:29
  • 1
    @KellymarydeAraujo perdão, era serve e não server. Já editei a resposta. Commented 15/02/2021 às 14:32
  • Funcionou, problema resolvido! Muito obrigada! Commented 15/02/2021 às 16:59

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .