Solucionado (ver solução)
Solucionado
(ver solução)
9
respostas

npm run build-dev Erro

Referente ao curso Webpack: Manipulando módulos na sua webapp, no capítulo Introdução e atividade Babel-loader, a ponte entre o Webpack e o Babel

por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts

Quando utilizo esse comando : 

npm run build-dev

Recebo o seguinte erro:

> client@1.0.0 build-dev /home/prop8/Documentos/Carreira Programador Angular/Webpack: Manipulando módulos/projeto-webpack/client
> webpack --config webpack.config.js

sh: 1: webpack: not found
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! client@1.0.0 build-dev: `webpack --config webpack.config.js`
npm ERR! spawn ENOENT
npm ERR! 
npm ERR! Failed at the client@1.0.0 build-dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/prop8/.npm/_logs/2018-08-02T14_27_39_468Z-debug.log

Mas quando faço a seguinte modificação no package.json funciona certinho 

"build-dev": "node_modules/webpack/bin/webpack.js --config webpack.config.js"
ash: 1c01b5d92a6aeac96560
Version: webpack 4.16.4
Time: 528ms
Built at: 2018-08-02 10:32:52
    Asset    Size  Chunks             Chunk Names
bundle.js  11 KiB       0  [emitted]  main
Entrypoint main = bundle.js
[0] ./app-src/app.js + 24 modules 21.2 KiB {0} [built]
    | ./app-src/domain/negociacao/NegociacaoService.js 2.44 KiB [built]
    | ./app-src/app.js 511 bytes [built]
    | ./app-src/domain/index.js 186 bytes [built]
    | ./app-src/domain/negociacao/NegociacaoDao.js 1.87 KiB [built]
    | ./app-src/ui/index.js 257 bytes [built]
    | ./app-src/domain/negociacao/Negociacao.js 719 bytes [built]
    | ./app-src/domain/negociacao/Negociacoes.js 474 bytes [built]
    | ./app-src/controllers/NegociacaoController.js 5.58 KiB [built]
    | ./app-src/util/index.js 374 bytes [built]
    | ./app-src/ui/views/MensagemView.js 218 bytes [built]
    | ./app-src/util/Obrigatorio.js 107 bytes [built]
    | ./app-src/util/decorators/Controller.js 996 bytes [built]
    | ./app-src/util/Bind.js 296 bytes [built]
    | ./app-src/util/decorators/Debounce.js 436 bytes [built]
    | ./app-src/util/HttpService.js 265 bytes [built]
    |     + 10 hidden modules

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/

Process finished with exit code 0

Por acaso o Sr. já passou por isso ? Tem solução? ] Sim, Já olhei na internet mais não conseguir entender.

9 respostas
por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Oi Felipe!

Nunca passei por isso não, mas cole o seu package.json para eu dar uma olhadinha :)

por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts
{
  "name": "client",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build-dev": "node_modules/webpack/bin/webpack.js --config webpack.config.js",
    "build-prod": "node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --config webpack.config.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "reflect-metadata": "^0.1.10"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-es2017": "^6.24.1",
    "babili-webpack-plugin": "^0.1.2",
    "cross-env": "^5.2.0",
    "webpack": "^4.16.4",
    "webpack-cli": "^3.1.0"
  }
}
por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Então, você fez exatamente como faço no curso, dessa forma?

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build-dev": "webpack --config webpack.config.js",
    "build-prod": "webpack -p --config webpack.config.js"
},

Só para termos certeza.

por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts

Sim, Fiz conforme o Sr. ensinou.

por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Pois é, aqui está funcionando . Qual a versão do Node você está usando? Altera novamente do jeito que deve ser e mesmo não funcionando cole o package.json para mim aqui. O package.json está em qual pasta?

por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts

OS: Ubuntu 18.04.1 LTS

prop8@prop8:~$ node -v
v8.11.3
prop8@prop8:~$ npm --v
5.6.0
prop8@prop8:~$
por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts
prop8@prop8:~/Documentos/Carreira Programador Angular/Webpack: Manipulando módulos/projeto-webpack/client$ ls
app-src  css  db.html  index.html  jsconfig.json  node_modules  package.json  package-lock.json  README.md  webpack.config.js
prop8@prop8:~/Documentos/Carreira Programador Angular/Webpack: Manipulando módulos/projeto-webpack/client$
por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts
{
  "name": "client",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build-dev": "webpack --config webpack.config.js",
    "build-prod": "cross-env NODE_ENV=production webpack --config webpack.config.js",
    "start": "webpack-dev-server"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "reflect-metadata": "^0.1.10"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-es2017": "^6.24.1",
    "babili-webpack-plugin": "^0.1.2",
    "cross-env": "^5.2.0",
    "webpack": "^4.16.4",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^2.5.1"
  }
}
solução!
por Felipe Caldeira Carneiro Martins
| 583.8k xp | 16 posts

Opa!!! Pedi ajuda de um colega de trabalho aqui e ele viu que eu tinha colocado o diretório com acento e espaço e por isso o npm não reconhecia os comandos que eu dava. Obrigado pela atenção!!

Diretório corrigido:

prop8@prop8:~/Documentos/CarreiraProgramadorAngular/Webpack_Manipulando_Modulos/projeto-webpack$

Diretório com erros:

prop8@prop8:~/Documentos/Carreira Programador Angular/Webpack: Manipulando módulos/babel_webpack_js$

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software