I followed this exactly, copy & pasted as well, and I keep getting the following error when running ‘npm start’. This is right after setting up .babelrc .
I also tried the following per Google Suggestions (removing multiple entries):
npm i babel-core — save
npm i babel-core — save-dev
npm i @babel-core — save
npm i @babel-core — save-dev
C:\WebstormProjects\react-component-webpack-tutorial>npm start
> react-component-webpack-tutorial@1.0.0 start C:\WebstormProjects\react-component-webpack-tutorial
> webpack-dev-server — mode development
i 「wds」: Project is running at http://localhost:3001/
i 「wds」: webpack output is served from /
× 「wdm」: Hash: 73d99481096d31b1e605
Version: webpack 4.17.1
Time: 3498ms
Built at: 2018–08–31 14:30:23
Asset Size Chunks Chunk Names
main.js 340 KiB main [emitted] main
./index.html 361 bytes [emitted]
Entrypoint main = main.js
[./examples/src/index.js] 1.72 KiB {main} [built] [failed] [1 error]
[./node_modules/ansi-html/index.js] 4.16 KiB {main} [built]
[./node_modules/events/events.js] 8.13 KiB {main} [built]
[./node_modules/html-entities/index.js] 231 bytes {main} [built]
[./node_modules/loglevel/lib/loglevel.js] 7.68 KiB {main} [built]
[./node_modules/querystring-es3/index.js] 127 bytes {main} [built]
[./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
[./node_modules/url/url.js] 22.8 KiB {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost:3001] (webpack)-dev-server/client?http://localhost:3001 7.78 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.58 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.05 KiB {main} [built]
[0] multi (webpack)-dev-server/client?http://localhost:3001 ./examples/src/index.js 40 bytes {main} [built]
[./node_modules/webpack/hot sync ^\.\/log$] (webpack)/hot sync nonrecursive ^\.\/log$ 170 bytes {main} [built]
[./node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 75 bytes {main} [built]
[./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1.11 KiB {main} [optional] [built]
+ 11 hidden modules
ERROR in ./examples/src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In C:\WebstormProjects\react-component-webpack-tutorial\node_modules\babel
-preset-react\lib\index.js
at createDescriptor (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-descriptors.js:178:11)
at items.map (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-descriptors.js:109:50)
at Array.map (<anonymous>)
at createDescriptors (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-descriptors.js:109:29)
at createPresetDescriptors (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-descriptors.js:101:10)
at presets (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-descriptors.js:47:19)
at mergeChainOpts (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-chain.js:315:26)
at C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-chain.js:278:7
at buildRootChain (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\config-chain.js:118:22)
at loadPrivatePartialConfig (C:\WebstormProjects\react-component-webpack-tutorial\node_modules\@babel\core\lib\config\partial.js:57:55)
@ multi (webpack)-dev-server/client?http://localhost:3001 ./examples/src/index.js main[1]
Child html-webpack-plugin for “index.html”:
1 asset
Entrypoint undefined = ./index.html
[./node_modules/html-webpack-plugin/lib/loader.js!./examples/src/index.html] 528 bytes {0} [built]
[./node_modules/lodash/lodash.js] 527 KiB {0} [built]
[./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 489 bytes {0} [built]
[./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
i 「wdm」: Failed to compile.