da2k / curso-reactjs-ninja

915 stars 322 forks source link

M1#A08: Problema ao executar o "npm start" #563

Closed wandrebarbosa closed 3 years ago

wandrebarbosa commented 3 years ago

Bom tarde, @fdaciuk , conforme sua dica na issue da colega no outro dia, instalei o webpack local (npm install --save-dev webpack-dev-server@1) e ainda continuo com o problema.

segue abaixo meus seguintes trechos de códigos:

########################### server.js:

'use strict'

const webpack = require('webpack')
const WebpackDevServer = require('webpack-dev-server')
const config = require('./webpack.config')

new WebpackDevServer(webpack(config), {
  publicPath: config.output.publicPath,
  hot: true,
  historyApiFallback: true,
  stats: { colors: true }
}).listen(3000, (err) => {
  if (err) {
    return console.log(err)
  }

  console.log('Listening on http://localhost:3000')
})

########################### package.json:

{
  "scripts": {
    "start": "node server.js"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^6.4.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "react-hot-loader": "^3.0.0-beta.2",
    "webpack": "^1.15.0",
    "webpack-dev-server": "^1.16.5"
  },
  "dependencies": {
    "react": "^15.4.2",
    "react-dom": "^15.4.2"
  }
}

########################### webpack.config.js:

'use strict'

const path = require('path')
const webpack = require('webpack')

module.exports = {
  devtool: 'source-map',

  entry: [
    'react-hot-loader/patch',
    'webpack-dev-server/client?http://localhost:3000',
    'webpack/hot/only-dev-server',
    path.join(__dirname, 'src', 'index')
  ],

  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/dist/'
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ],

  module: {
    loaders: [{
      test: /\.js$/,
      exclude: /node_modules/,
      include: /src/,
      loader: 'babel'
    }]
  }
}

continuo ainda ao aplicar o npm start o erro abaixo: image

@fdaciuk

2lipe commented 3 years ago

Rodando pelo npm o comando correto seria "npm run start", ele precisa de "run" no comando para executar a ação, espero ter ajudado..

On Mon, Aug 23, 2021 at 5:03 PM wandrebarbosa @.***> wrote:

Bom tarde, @fdaciuk https://github.com/fdaciuk , conforme sua dica na issue da colega no outro dia, instalei o webpack local (npm install --save-dev @.***) e ainda continuo com o problema.

segue abaixo meus seguintes trechos de códigos:

########################### server.js:

'use strict'

const webpack = require('webpack')

const WebpackDevServer = require('webpack-dev-server')

const config = require('./webpack.config')

new WebpackDevServer(webpack(config), {

publicPath: config.output.publicPath,

hot: true,

historyApiFallback: true,

stats: { colors: true }

}).listen(3000, (err) => {

if (err) {

return console.log(err)

}

console.log('Listening on http://localhost:3000')

})

########################### package.json:

{

"scripts": {

"start": "node server.js"

},

"devDependencies": {

"babel-core": "^6.26.0",

"babel-loader": "^6.4.1",

"babel-preset-es2015": "^6.24.1",

"babel-preset-react": "^6.24.1",

"babel-preset-stage-0": "^6.24.1",

"react-hot-loader": "^3.0.0-beta.2",

"webpack": "^1.15.0",

"webpack-dev-server": "^1.16.5"

},

"dependencies": {

"react": "^15.4.2",

"react-dom": "^15.4.2"

}

}

########################### webpack.config.js:

'use strict'

const path = require('path')

const webpack = require('webpack')

module.exports = {

devtool: 'source-map',

entry: [

'react-hot-loader/patch',

'webpack-dev-server/client?http://localhost:3000',

'webpack/hot/only-dev-server',

path.join(__dirname, 'src', 'index')

],

output: {

path: path.join(__dirname, 'dist'),

filename: 'bundle.js',

publicPath: '/dist/'

},

plugins: [

new webpack.HotModuleReplacementPlugin()

],

module: {

loaders: [{

  test: /\.js$/,

  exclude: /node_modules/,

  include: /src/,

  loader: 'babel'

}]

}

}

continuo ainda ao aplicar o npm start o erro abaixo: [image: image] https://user-images.githubusercontent.com/23178857/130511829-1aafd3ad-9c1b-42cc-8b4b-076da079f454.png

@fdaciuk https://github.com/fdaciuk

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/da2k/curso-reactjs-ninja/issues/563, or unsubscribe https://github.com/notifications/unsubscribe-auth/AOKRLN6ZB5Y3FRNUYFSLMCLT6KSRFANCNFSM5CVJOH3A .

wandrebarbosa commented 3 years ago

Rodando pelo npm o comando correto seria "npm run start", ele precisa de "run" no comando para executar a ação, espero ter ajudado..

Infelizmente isso não funcionou amigo, @2lipe.

fdaciuk commented 3 years ago

Oi @wandrebarbosa! Para o comando start, não precisa do run =) No seu caso, o problema é que você instalou o webpack-dev-server, mas não instalou o webpack. Instalando ele, ao rodar o npm start tudo deve funcionar como esperado :)

wandrebarbosa commented 3 years ago

Boa noite @fdaciuk , desculpa a demora, faculdade e TCC nesse semestre ta osso, conseguir aqui sim, obrigado, continuando o curso, esta ótimo a proposito.