View Code? Open in Web Editor
NEW
The advanced React, Webpack, Babel Setup. You want to get beyond create-react-app?
Home Page: https://www.robinwieruch.de
JavaScript 94.93%
HTML 5.07%
advanced-react-webpack-babel-setup's Introduction
👋 Hello, I'm Robin, a freelance web developer
👀 I'm working with companies on their products
🌱 My passion is with @reactjs, @nextjs, @typescript, @nodejs, @mysql, @postgresql, @sqlite
📫 How to reach me ... [email protected]
advanced-react-webpack-babel-setup's People
Contributors
advanced-react-webpack-babel-setup's Issues
hello
I just wondered what is element
attribute doing you used on
<Route path={routes.PROGRAMMING} element={<Programming />} />
i searched the doc and i found nothing about it!
The devDependency webpack was updated from 4.35.3
to 4.36.0
.
🚨 View failing branch .
This version is covered by your current version range and after updating it in your project the build failed .
webpack is a devDependency of this project. It might not break your production code or affect downstream projects , but probably breaks your build or test tools, which may prevent deploying or publishing .
Status Details
❌ continuous-integration/travis-ci/push: The Travis CI build could not complete due to an error (Details ).
Release Notes for v4.36.0
Features
SourceMapDevToolPlugin append
option now supports the default placeholders in addition to [url]
Arrays in resolve and parser options (Rule and Loader API) support backreferences with "..."
when overriding options.
Commits
The new version differs by 42 commits.
95d21bb
4.36.0
aa1216c
Merge pull request #9422 from webpack/feature/dot-dot-dot-merge
b3ec775
improve merging of resolve and parsing options
53a5ae2
Merge pull request #9419 from vankop/remove-valid-jsdoc-rule
ab75240
Merge pull request #9413 from webpack/dependabot/npm_and_yarn/ajv-6.10.2
0bdabf4
Merge pull request #9418 from webpack/dependabot/npm_and_yarn/eslint-plugin-jsdoc-15.5.2
f207cdc
remove valid jsdoc rule in favour of eslint-plugin-jsdoc
31333a6
chore(deps-dev): bump eslint-plugin-jsdoc from 15.3.9 to 15.5.2
036adf0
Merge pull request #9417 from webpack/dependabot/npm_and_yarn/eslint-plugin-jest-22.8.0
37d4480
Merge pull request #9411 from webpack/dependabot/npm_and_yarn/simple-git-1.121.0
ce2a183
chore(deps-dev): bump eslint-plugin-jest from 22.7.2 to 22.8.0
0beeb7e
Merge pull request #9391 from vankop/create-hash-typescript
bf1a24a
#9391 resolve super call discussion
bd7d95b
#9391 resolve discussions, AbstractMethodError
4190638
chore(deps): bump ajv from 6.10.1 to 6.10.2
There are 42 commits in total.
See the full diff
FAQ and help
There is a collection of frequently asked questions . If those don’t help, you can always ask the humans behind Greenkeeper .
Your Greenkeeper Bot 🌴
Sorry for disturbing again, but I really need this.
In your series, you use CSS Modules, more like as a component import styles from "./style.css"
then reference it with
className={styles.title}
I want to use it straight away without importing it as a component.
Like
import "./style.css"
className="title"
is it possible to add css-modules support ?
Is it possible to add TS support?
Typing npm start after installation result in a compilation fail.
`
C:\Users\pitik\Desktop\advanced-react-webpack-babel-setup> npm start
[email protected] start C:\Users\pitik\Desktop\advanced-react-webpack-babel-setup
webpack-dev-server --config build-utils/webpack.config.js --env.env=dev
i 「wds」: Project is running at http://localhost:8080/
i 「wds」: webpack output is served from /
i 「wds」: Content not from webpack is served from ./dist
× 「wdm」: Hash: 7d13dd8472c7c42ef282
Version: webpack 4.34.0
Time: 1032ms
Built at: 2019-06-25 16:41:41
Asset Size Chunks Chunk Names
bundle.js 926 KiB main [emitted] main
index.html 213 bytes [emitted]
Entrypoint main = bundle.js
[0] multi (webpack)-dev-server/client?http://localhost (webpack)/hot/dev-server.js ./src/index.js 52 bytes {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost] (webpack)-dev-server/client?http://localhost 4.29 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.59 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.04 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/createSocketUrl.js] (webpack)-dev-server/client/utils/createSocketUrl.js 2.77 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
[./node_modules/webpack-dev-server/client/utils/reloadApp.js] (webpack)-dev-server/client/utils/reloadApp.js 1.63 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/sendMessage.js] (webpack)-dev-server/client/utils/sendMessage.js 402 bytes {main} [built]
[./node_modules/webpack-dev-server/node_modules/strip-ansi/index.js] (webpack)-dev-server/node_modules/strip-ansi/index.js 161 bytes {main} [built]
[./node_modules/webpack/hot sync ^./log$] (webpack)/hot sync nonrecursive ^./log$ 170 bytes {main} [built]
[./node_modules/webpack/hot/dev-server.js] (webpack)/hot/dev-server.js 1.59 KiB {main} [built]
[./node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 75 bytes {main} [built]
[./node_modules/webpack/hot/log-apply-result.js] (webpack)/hot/log-apply-result.js 1.27 KiB {main} [built]
[./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1.34 KiB {main} [built]
[./src/index.js] 554 bytes {main} [built] [failed] [1 error]
+ 20 hidden modules
ERROR in ./src/index.js
Module build failed (from ./node_modules/eslint-loader/index.js):
Error: Cannot find module 'eslint/lib/formatters/stylish'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:582:15)
at Function.Module._load (internal/modules/cjs/loader.js:508:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
at Object.module.exports (C:\Users\pitik\Desktop\advanced-react-webpack-babel-setup\node_modules\eslint-loader\index.js:199:26)
Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = index.html
[./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html] 407 bytes {0} [built]
[./node_modules/lodash/lodash.js] 527 KiB {0} [built]
[./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 472 bytes {0} [built]
[./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
i 「wdm」: Failed to compile.
`
Config:
Windows10 64B
NODEJS version 10.15.3
npm v6.4.1
Great template, however the babel doesn't seem to support JSX as ReactJS is a bigger user
ERROR in ./src/contexts/AuthProvider/AuthProvider.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: advanced-react-webpack-babel-setup/src/contexts/AuthProvider/AuthProvider.js: Support for the experimental syntax 'jsx' isn't currently enabled (21:9):
19 |
20 | return (
21 | <AuthContext.Provider value={{state, setState}}>
| ^
22 | {children}
23 | </AuthContext.Provider>
24 | )
Add @babel/preset-react (https://git.io/JfeDR ) to the 'presets' section of your Babel config to enable transformation.