Skip to content

Commit 04e2950

Browse files
michielbouwmichielbouw
committed
create react app in monorepo with yarn and lerna for react 16.8.0-alpha.0
0 parents  commit 04e2950

36 files changed

+13900
-0
lines changed

‎.eslintignore‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
**/dist/**
2+
**/build/**
3+
**/node_modules/**
4+
**/*.test.{js,jsx,ts,tsx}
5+
**/*.spec.{js,jsx,ts,tsx}
6+
**/config-overrides.js

‎.eslintrc.json‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
{
2+
"parser": "@typescript-eslint/parser",
3+
"parserOptions": {
4+
"project": "./tsconfig.json",
5+
"ecmaFeatures": {
6+
"jsx": true
7+
},
8+
"ecmaVersion": 2018,
9+
"sourceType": "module"
10+
},
11+
"plugins": ["@typescript-eslint", "simple-import-sort"],
12+
"extends": [
13+
"prettier",
14+
"prettier/react",
15+
"react-app",
16+
"eslint:recommended",
17+
"plugin:react/recommended",
18+
"prettier/@typescript-eslint",
19+
"plugin:@typescript-eslint/eslint-recommended",
20+
"plugin:@typescript-eslint/recommended"
21+
],
22+
"rules": {
23+
"@typescript-eslint/explicit-function-return-type": "off",
24+
"@typescript-eslint/explicit-member-accessibility": "off",
25+
"@typescript-eslint/no-explicit-any": "off",
26+
"@typescript-eslint/no-unused-vars": "off",
27+
"@typescript-eslint/no-submodule-imports": "off",
28+
"@typescript-eslint/no-unused-expressions": "warn",
29+
"@typescript-eslint/no-use-before-define": "off",
30+
"@typescript-eslint/jsx-no-lambda": "off",
31+
"@typescript-eslint/prefer-interface": "off",
32+
"@typescript-eslint/interface-name-prefix": "off",
33+
"@typescript-eslint/camelcase": "off",
34+
"simple-import-sort/sort": "warn",
35+
"no-console": "off",
36+
"sort-keys": "off",
37+
"sort-imports": "off"
38+
},
39+
"env": {
40+
"browser": true,
41+
"es6": true
42+
}
43+
}

‎.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
**/node_modules/**
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
**/build/**
13+
**/dist/**
14+
15+
# misc
16+
.DS_Store
17+
.env.local
18+
.env.development.local
19+
.env.test.local
20+
.env.production.local
21+
22+
npm-debug.log*
23+
yarn-debug.log*
24+
yarn-error.log*

‎.prettierrc‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"printWidth": 80,
3+
"singleQuote": true,
4+
"semi": true,
5+
"tabWidth": 2,
6+
"trailingComma": "all",
7+
"arrowParens": "avoid"
8+
}

‎README.md‎

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
# React (v16.8.0-alpha.0), Typescript, Yarn & Lerna Monorepo
2+
3+
Starting point for a Typescript, React (v16.8.0-alpha.0), Yarn & Lerna monorepo project with full setup for ESLint and Prettier.
4+
5+
## Stack
6+
7+
This project is initialized with [Create React App](https://github.com/facebook/create-react-app) consisting of:
8+
9+
- TypeScript
10+
- React (v16.8.0-alpha.0)
11+
- react-scripts (react-scripts v2.1.3 from createReactApp)
12+
- react-testing-library (not Enzyme)
13+
- Yarn Workspaces (multiple packages architecture)
14+
- Lerna (tool for managing the monorepo packages)
15+
- SASS/SCSS
16+
- ESLint (instead of deprecated TSLint)
17+
- Prettier
18+
19+
### Content
20+
21+
The project now consists of 3 packages.
22+
23+
- www: create-react-app with TypeScript (react v16.8.0-alpha.0, react-scripts v2.1.3)
24+
- shared: react components with TypeScript (react v16.8.0-alpha.0)
25+
- utils: shared functions with TypeScript
26+
27+
## Get Started
28+
29+
### Make sure you run Node.js v10+
30+
31+
To install check ([Node.js installation](https://nodejs.org/en/) or [Node Version Manager installation](https://github.com/nvm-sh/nvm)).
32+
33+
### Clone or copy this repo
34+
35+
```bash
36+
curl -L https://github.com/michielbouw/react-typescript-yarn-lerna-monorepo-eslint-prettier-boilerplate/archive/master.zip | tar zx
37+
mv react-typescript-eslint-prettier-boilerplate APP_NAME
38+
cd APP_NAME
39+
```
40+
41+
or
42+
43+
```bash
44+
git clone [email protected]:michielbouw/react-typescript-yarn-lerna-monorepo-eslint-prettier-boilerplate.git APP_NAME
45+
cd APP_NAME
46+
```
47+
48+
### `yarn install`
49+
50+
Note: this project is initialized with Yarn.
51+
52+
### Adding / removing packages
53+
54+
To add a new package
55+
56+
After changing the packages run `yarn clean && npx lerna bootstrap` to clean & reinit the workspaces.
57+
58+
## Development Scripts
59+
60+
In the project directory, you can run:
61+
62+
### `yarn start`
63+
64+
Runs the app in the development mode.<br>
65+
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
66+
67+
The page will reload if you make edits.<br>
68+
You will also see any lint errors in the console.
69+
70+
### `yarn typecheck`
71+
72+
Launches the typescript check for code to check for TypeScript compilation errors or warnings.
73+
74+
### `yarn lint`
75+
76+
Launches the linter for code to check for code layout errors or warnings.
77+
78+
### `yarn lint:fix`
79+
80+
Launches the linter for code to check for code layout errors or warnings, and fixes the ones that can be fixed automatically.
81+
82+
### `yarn test`
83+
84+
Launches the test runner in the interactive watch mode.<br>
85+
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
86+
87+
## Production Scripts
88+
89+
### `yarn build`
90+
91+
Builds the app for production to the build folder.<br>
92+
It correctly bundles React in production mode and optimizes the build for the best performance.
93+
94+
The build is minified and the filenames include the hashes.<br>
95+
Your app is ready to be deployed!
96+
97+
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
98+
99+
## Learn More
100+
101+
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
102+
103+
To learn React, check out the [React documentation](https://reactjs.org/).

‎lerna.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"packages": [
3+
"packages/*"
4+
],
5+
"version": "0.0.1",
6+
"npmClient": "yarn",
7+
"useWorkspaces": true
8+
}

‎package.json‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
{
2+
"name": "react-typescript-yarn-lerna-monorepo-eslint-prettier-boilerplate",
3+
"author": {
4+
"name": "Michiel Bouw",
5+
"url": "http://michielbouw.nl"
6+
},
7+
"license": "MIT",
8+
"private": true,
9+
"scripts": {
10+
"start": "lerna run start --parallel",
11+
"build": "lerna run build --parallel",
12+
"test": "lerna run test --parallel",
13+
"typecheck": "lerna run typecheck --parallel",
14+
"lint": "lerna run lint --parallel",
15+
"lint:fix": "lerna run lint:fix --parallel",
16+
"start:www": "lerna run start --scope=\"@web/shared\" --scope=\"@web/utils\" --scope=\"@web/www\" --stream",
17+
"build:www": "lerna run build --scope=\"@web/shared\" --scope=\"@web/utils\" --scope=\"@web/www\" --stream",
18+
"test:www": "lerna run test --scope=\"@web/shared\" --scope=\"@web/utils\" --scope=\"@web/www\" --stream",
19+
"lint:www": "lerna run lint --scope=\"@web/shared\" --scope=\"@web/utils\" --scope=\"@web/www\" --stream",
20+
"lint:fix:www": "lerna run lint:fix --scope=\"@web/shared\" --scope=\"@web/utils\" --scope=\"@web/www\" --stream",
21+
"clean": "lerna clean"
22+
},
23+
"devDependencies": {
24+
"@types/jest": "23.3.12",
25+
"@types/node": "10.12.18",
26+
"@types/react": "^16.7.18",
27+
"@types/react-dom": "^16.0.11",
28+
"@typescript-eslint/eslint-plugin": "^2.30.0",
29+
"@typescript-eslint/parser": "^2.30.0",
30+
"eslint-config-prettier": "^6.7.0",
31+
"eslint-plugin-prettier": "^3.1.1",
32+
"eslint-plugin-simple-import-sort": "^5.0.0",
33+
"lerna": "^3.20.2",
34+
"node-sass": "^4.14.0",
35+
"prettier": "^2.0.5",
36+
"react": "^16.8.0-alpha.0",
37+
"react-dom": "^16.8.0-alpha.0",
38+
"react-scripts": "2.1.3",
39+
"typescript": "~3.7.2"
40+
},
41+
"workspaces": {
42+
"packages": [
43+
"packages/*"
44+
]
45+
}
46+
}

‎packages/shared/.eslintrc.json‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"extends": "../../.eslintrc.json",
3+
"parserOptions": {
4+
"project": "./tsconfig.json",
5+
"ecmaFeatures": {
6+
"jsx": true
7+
},
8+
"ecmaVersion": 2018,
9+
"sourceType": "module"
10+
}
11+
}

‎packages/shared/.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
build

‎packages/shared/package.json‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "@web/shared",
3+
"version": "0.0.1",
4+
"author": {
5+
"name": "Michiel Bouw",
6+
"url": "http://michielbouw.nl"
7+
},
8+
"private": true,
9+
"main": "build/index.js",
10+
"typings": "build/index.d.ts",
11+
"scripts": {
12+
"start": "tsc -w",
13+
"build": "tsc",
14+
"typecheck": "tsc --noEmit --skipLibCheck",
15+
"lint": "eslint . --ignore-path ../../.eslintignore --ext ts --ext tsx --ext js --ext jsx",
16+
"lint:fix": "eslint --fix . --ignore-path ../../.eslintignore --ext ts --ext tsx --ext js --ext jsx"
17+
},
18+
"peerDependencies": {
19+
"@types/jest": ">=23.3.12",
20+
"@types/node": ">=10.12.18",
21+
"@types/react": ">=16.7.18",
22+
"@types/react-dom": ">=16.0.11",
23+
"@typescript-eslint/eslint-plugin": "^2.30.0",
24+
"@typescript-eslint/parser": "^2.30.0",
25+
"eslint-config-prettier": "^6.7.0",
26+
"eslint-plugin-prettier": "^3.1.1",
27+
"eslint-plugin-simple-import-sort": "^5.0.0",
28+
"react": ">=16.8.0-alpha.0",
29+
"react-dom": ">=16.8.0-alpha.0",
30+
"typescript": ">=3.7.2"
31+
},
32+
"dependencies": {},
33+
"devDependencies": {}
34+
}

0 commit comments

Comments
 (0)