This template will use for Udemy GraphQL Section.
There's a lot of problems when follow this course when code along the video section. Because of library version isn't match from current and in the video (I guess most of the videos in this course was recorded in aroung 2019 - 2020). Some of libraries version aren't support or conflict to each others so far.
Ex: In this course, Yihua (the lecture) was using [email protected]
and [email protected]
. You may get an error which is Node Sass does not yet support your current environment
. You may need to use sass
instead. unfortunately, [email protected]
which bundled by Webpack 4.19 which did not include .sass
file loader. So you may need to upgrade react-scripts to [email protected]
to compile sass
file.
In this Udemy lesson, will use 3 libraries which are apollo-boost
, react-apollo
and graphql
. If you running on your own project or start of lesson project you will get the error:
Because of currently, we use [email protected]
which bundled by Webpack 5. unfortunately, Webpack 5 causes an error with graphql
library (shown above). How I fix these errors and step by step to fix by your own is in this section
- Clone the repo
- Run
npm install
oryarn
- Run
npm start
oryarn start
If you want to fix error directly in your code. Follow these steps:
- Run
npm run eject
- Go to
config/webpack.config.js
- Move to
line 340
- Include these config following
{
test: /\.m?js/,
resolve: {
fullySpecified: false,
},
},
- Your config file will look like this
rules: [
{
test: /\.m?js/,
resolve: {
fullySpecified: false,
},
},
...
]
Note: After run npm eject
, when you open any file *.(jsx | js) it may have an red underline in very top of these file. Just ignore it and continue to code.