Merge pull request #11 from ilyasudakov/develop

Fix typescript jest config

Author: ilyasudakov

.gitignore

@@ -1,5 +1,6 @@
 # ignore generated modules/files
 /node_modules/
+/.vscode/
 package-lock.json
 /coverage/
 public/*

bin/setup.js

@@ -125,6 +125,11 @@ function copyTypeScriptFiles() {
       shell.cp('bin/typescript/webpack.prod.ts', 'webpack.prod.ts');
       shell.cp('bin/typescript/.eslintrc.js', '.eslintrc.js');
       shell.cp('bin/typescript/App.tsx', 'src/components/App.tsx');
+      shell.cp('bin/typescript/App.test.js', 'src/components/App.test.js');
+      shell.cp(
+        'bin/typescript/jest.config.js',
+        'jest.config.js',
+      );
       shell.cp('bin/typescript/index.tsx', 'src/index.tsx');
       resolve();
     } catch (err) {

bin/typescript/App.test.js

@@ -0,0 +1,9 @@
+import { render } from '@testing-library/react';
+import { App } from './App.tsx';
+
+describe('App component', () => {
+  test('renders', () => {
+    const { getByText } = render(<App />);
+    expect(getByText('App')).toBeInTheDocument();
+  });
+});

bin/typescript/App.tsx

@@ -1,4 +1,3 @@
 export const App: React.FC = () => {
-    return <div>MyApp</div>;
-  };
-  
+  return <div>MyApp</div>;
+};

bin/typescript/jest.config.js

@@ -0,0 +1,13 @@
+module.exports = {
+  roots: ['<rootDir>/src'],
+  transform: {
+    '^.+\\.tsx?$': 'ts-jest',
+  },
+  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$',
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+  testPathIgnorePatterns: ['/node_modules/', '/public/'],
+  setupFilesAfterEnv: [
+    './src/setupTests.js',
+    '@testing-library/jest-dom/extend-expect',
+  ],
+};

bin/typescript/package.json

@@ -1,11 +1,11 @@
 {
-  "name": "basic_react_boilerplate",
+  "name": "react-base",
   "version": "1.0.0",
-  "description": "React + Webpack 5 + SCSS + Jest/RTL",
+  "description": "Simple React boilerplate with TS or JS - its your choice, Webpack 5, Jest/RTL, Axios&React-Query, ESLint&Prettier and more",
   "main": "index.tsx",
   "repository": {
     "type": "git",
-    "url": "git://github.com/ilyasudakov/basic-react-boilerplate.git"
+    "url": "git://github.com/ilyasudakov/react-base.git"
   },
   "scripts": {
     "start": "webpack serve",
@@ -30,6 +30,8 @@
     "typescript": "^4.1.3",
     "@types/webpack": "^4.41.26",
     "ts-node": "^9.1.1",
+    "@types/jest": "^26.0.20",
+    "ts-jest": "^26.5.0",
     "@babel/core": "^7.12.10",
     "@babel/preset-env": "^7.12.11",
     "@babel/preset-react": "^7.12.10",

bin/typescript/tsconfig.json

@@ -1,12 +1,12 @@
 {
-	"compilerOptions": {
-		"outDir": "./public/",
-		"noImplicitAny": true,
-		"target": "es5",
-		"lib": ["es5", "es6", "dom"],
-		"jsx": "react-jsx",
-		"allowJs": true,
-		"moduleResolution": "node",
-		"allowSyntheticDefaultImports": true,
-	}
-}
+  "compilerOptions": {
+    "outDir": "./public/",
+	"noImplicitAny": true,
+	"target": "es5",
+	"lib": ["es5", "es6", "dom"],
+	"jsx": "react-jsx",
+	"allowJs": true,
+	"moduleResolution": "node",
+	"allowSyntheticDefaultImports": true
+  }
+}  

bin/typescript/webpack.prod.ts

@@ -11,7 +11,7 @@ const config: webpack.Configuration = {
   mode: "production",
   entry: "./src/index.tsx",
   output: {
-    path: path.resolve(__dirname, "dist"),
+    path: path.resolve(__dirname, "public"),
     filename: "bundle.js"
   },
   resolve: {

package.json

@@ -1,11 +1,11 @@
 {
-  "name": "basic_react_boilerplate",
+  "name": "react-base",
   "version": "1.0.0",
-  "description": "React + Webpack 5 + SCSS + Jest/RTL",
+  "description": "Simple React boilerplate with TS or JS - its your choice, Webpack 5, Jest/RTL, Axios&React-Query, ESLint&Prettier and more",
   "main": "index.js",
   "repository": {
     "type": "git",
-    "url": "git://github.com/ilyasudakov/basic-react-boilerplate.git"
+    "url": "git://github.com/ilyasudakov/react-base.git"
   },
   "scripts": {
     "start": "webpack serve",