sujilnt/reactboilerplate

A React.js Production Template using Webpack, Babel and Jest with eslint configured.

ReactBoilerplate

A React.js Production Template using Webpack, Babel and Jest still (under work).

install

git clone https://github.com/sujilnt/ReactBoilerplate
yarn install

For Development

yarn run devServer

For Production

yarn run prod

reactboilerplate's Issues

Jest issues

Need to handle Mock files for jest setup inorder to run the test case properly?
Mock files are need to be created for

1. images => .svg or jpg
2. fonts => font
3. API mockup

jest encountered an unexpected token-reference #125

Hi,

I have originally started with react-scripts test but Console.log is not behaving properly(it print messages sometimes) and console.log works with jest,also jest can support more.
I am getting same error refrenced in issue 125 with jest.

-------------------------ERROR START-------------
FAIL src/App.test.js
● Test suite failed to run

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

App.test.js: Unexpected token (11:20)

   9 | it('renders without crashing', () => {
  10 |     const div = document.createElement('div');
> 11 |     ReactDOM.render(<App />, div);
     |                     ^
  12 |     ReactDOM.unmountComponentAtNode(div);
  13 | });
  14 |

  at Parser.raise (node_modules/@babel/parser/lib/index.js:6325:17)
  at Parser.unexpected (node_modules/@babel/parser/lib/index.js:7642:16)
  at Parser.parseExprAtom (node_modules/@babel/parser/lib/index.js:8841:20)
  at Parser.parseExprSubscripts (node_modules/@babel/parser/lib/index.js:8412:23)
  at Parser.parseMaybeUnary (node_modules/@babel/parser/lib/index.js:8392:21)
  at Parser.parseExprOps (node_modules/@babel/parser/lib/index.js:8267:23)
  at Parser.parseMaybeConditional (node_modules/@babel/parser/lib/index.js:8240:23)
  at Parser.parseMaybeAssign (node_modules/@babel/parser/lib/index.js:8187:21)
  at Parser.parseExprListItem (node_modules/@babel/parser/lib/index.js:9491:18)
  at Parser.parseCallExpressionArguments (node_modules/@babel/parser/lib/index.js:8621:2

----------------------ERROR END------------------------------------------

below is my package.json file, this application is on windows 10 pro
{
"name": "my-ui",
"version": "0.1.0",
"private": true,
"dependencies": {
"moment": "^2.24.0",
"node-sass": "^4.12.0",
"open-iconic": "^1.1.1",
"react": "^16.8.6",
"react-data-grid": "^6.1.0",
"react-data-grid-addons": "^6.1.0",
"react-dom": "^16.8.6",
"react-recaptcha": "^2.3.10",
"react-router-dom": "^4.3.1",
"react-scripts": "^2.1.8"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"build-dev": "dotenv -e .env.development react-scripts build",
"test": "jest",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"devDependencies": {
"babel-jest": "^24.8.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"dotenv-cli": "^1.4.0",
"jest": "^24.8.0",
"jsx-to-string": "^1.4.0",
"react-test-renderer": "^16.8.6"
},
".babelrc": {
"presets": [
"es2015",
"react"
]
}
}

I have followed https://stackoverflow.com/questions/35756479/does-jest-support-es6-import-export
but it throws same error,what is stage 0 and why stage 0 is dangerous?

Title issue

Not displaying the title <%= htmlWebpackPlugin.options.title %>