azat-co / react-quickly

Source code for React Quickly [Manning, 2017]: Painless Web Apps with React, JSX, Redux, and GraphQL 📕
http://reactquickly.co
MIT License
544 stars 422 forks source link

ch14 example babel config won't start; deprecated babel config `latest` #19

Open benshine opened 6 years ago

benshine commented 6 years ago

From a clean clone of this repo, the ch14 example fails at npm start: ben-15:redux-netflix ben$ npm start

 redux-netfix@0.0.1 start /Users/ben/src/react-quickly/ch14/redux-netflix
 concurrently "webpack --watch --config webpack.config.js" "webpack-dev-server"

[1] http://localhost:8080/webpack-dev-server/
[1] webpack result is served from /
[1] content is served from /Users/ben/src/react-quickly/ch14/redux-netflix
[0] Hash: ebff2e30884cfa7a06fe
[0] Version: webpack 1.13.1
[0] Time: 938ms
[0]    Asset    Size  Chunks             Chunk Names
[0] index.js  272 kB       0  [emitted]  index
[0]    [0] multi index 40 bytes {0} [built] [1 error]
[0]     + 328 hidden modules
[0] 
[0] ERROR in ./src/index.js
[0] Module build failed: Error: Couldn't find preset "latest" relative to directory "/Users/ben/src"

This seems related to the deprecation of babel-preset-latest.

I tried to resolve by switching to babel-preset-env as instructed in http://babeljs.io/env , but i am not yet skilled at webpack config.

dylanklbld commented 6 years ago

This seems related to the deprecation of babel-preset-latest.

Try do this: 1) create in your root project folder file .babelrc and put presets configuration like this

{
    "presets":["react", "es2015"]
}

2) npm i -save-dev babel-preset-react babel-preset-es2015 3) Put this as babel-loader configuration:

{
            test: /\.js?$/,
            exclude: /(node_modules)/,
            loader: 'babel-loader'
}

4) recompile you bundle.js (or how did you call it)