Skip to content

Commit 48c413d

Browse files
author
Alexey Ivanov
committed
initial commit
0 parents  commit 48c413d

File tree

11 files changed

+6269
-0
lines changed

11 files changed

+6269
-0
lines changed

.babelrc

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"presets": [
3+
"@babel/preset-env",
4+
"@babel/preset-react",
5+
"@babel/preset-typescript"
6+
],
7+
"plugins": [
8+
[
9+
"@babel/plugin-transform-runtime",
10+
{
11+
"regenerator": true
12+
}
13+
]
14+
]
15+
}

.eslintrc.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"parser": "@typescript-eslint/parser",
3+
"parserOptions": {
4+
"ecmaVersion": 2018,
5+
"sourceType": "module"
6+
},
7+
"plugins": ["@typescript-eslint", "react-hooks"],
8+
"extends": [
9+
"plugin:react/recommended",
10+
"plugin:@typescript-eslint/recommended"
11+
],
12+
"rules": {
13+
"react-hooks/rules-of-hooks": "error",
14+
"react-hooks/exhaustive-deps": "warn",
15+
"react/prop-types": "off"
16+
},
17+
"settings": {
18+
"react": {
19+
"pragma": "React",
20+
"version": "detect"
21+
}
22+
}
23+
}

.gitignore

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

README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# react-typescript-eslint-webpack
2+
Webpack template for a React app with TypeScript and ESLint

package.json

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "my-app",
3+
"version": "0.0.1",
4+
"license": "MIT",
5+
"scripts": {
6+
"start": "webpack serve --config webpack.dev.config.ts",
7+
"build": "webpack --config webpack.prod.config.ts"
8+
},
9+
"dependencies": {
10+
"react": "^17.0.1",
11+
"react-dom": "^17.0.1"
12+
},
13+
"devDependencies": {
14+
"@babel/core": "^7.12.10",
15+
"@babel/plugin-transform-runtime": "^7.12.10",
16+
"@babel/preset-env": "^7.12.11",
17+
"@babel/preset-react": "^7.12.10",
18+
"@babel/preset-typescript": "^7.12.7",
19+
"@babel/runtime": "^7.12.5",
20+
"@types/fork-ts-checker-webpack-plugin": "^0.4.5",
21+
"@types/react": "^17.0.0",
22+
"@types/react-dom": "^17.0.0",
23+
"@types/webpack": "^5.28.0",
24+
"@types/webpack-dev-server": "^3.11.1",
25+
"@typescript-eslint/eslint-plugin": "^4.11.1",
26+
"@typescript-eslint/parser": "^4.11.1",
27+
"babel-loader": "^8.2.2",
28+
"clean-webpack-plugin": "^4.0.0-alpha.0",
29+
"eslint": "^7.17.0",
30+
"eslint-plugin-react": "^7.22.0",
31+
"eslint-plugin-react-hooks": "^4.2.0",
32+
"eslint-webpack-plugin": "^2.4.1",
33+
"fork-ts-checker-webpack-plugin": "^6.0.8",
34+
"html-webpack-plugin": "^5.3.1",
35+
"ts-node": "^10.0.0",
36+
"typescript": "^4.1.3",
37+
"webpack": "^5.11.1",
38+
"webpack-cli": "^4.3.1",
39+
"webpack-dev-server": "^3.11.1"
40+
}
41+
}

src/index.html

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>My app</title>
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
</body>
10+
</html>

src/index.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from "react";
2+
import ReactDOM from "react-dom";
3+
4+
const App = () => (
5+
<h1>My React and TypeScript App!! {new Date().toLocaleDateString()}</h1>
6+
);
7+
8+
ReactDOM.render(
9+
<React.StrictMode>
10+
<App />
11+
</React.StrictMode>,
12+
document.getElementById("root")
13+
);

tsconfig.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"compilerOptions": {
3+
"lib": ["dom", "dom.iterable", "esnext"],
4+
"allowJs": true,
5+
"allowSyntheticDefaultImports": true,
6+
"skipLibCheck": true,
7+
"esModuleInterop": true,
8+
"strict": true,
9+
"forceConsistentCasingInFileNames": true,
10+
"moduleResolution": "node",
11+
"resolveJsonModule": true,
12+
"isolatedModules": true,
13+
"noEmit": true,
14+
"jsx": "react"
15+
},
16+
"include": ["src"]
17+
}

webpack.dev.config.ts

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import path from "path";
2+
import webpack from "webpack";
3+
import HtmlWebpackPlugin from "html-webpack-plugin";
4+
import ForkTsCheckerWebpackPlugin from "fork-ts-checker-webpack-plugin";
5+
import ESLintPlugin from "eslint-webpack-plugin";
6+
7+
interface WebpackConfiguration extends webpack.Configuration {
8+
devServer: {
9+
contentBase: string,
10+
historyApiFallback: boolean,
11+
port: number,
12+
open: boolean,
13+
hot: boolean,
14+
}
15+
}
16+
17+
const config: WebpackConfiguration = {
18+
mode: "development",
19+
output: {
20+
publicPath: "/",
21+
},
22+
entry: "./src/index.tsx",
23+
module: {
24+
rules: [
25+
{
26+
test: /\.(ts|js)x?$/i,
27+
exclude: /node_modules/,
28+
use: {
29+
loader: "babel-loader",
30+
options: {
31+
presets: [
32+
"@babel/preset-env",
33+
"@babel/preset-react",
34+
"@babel/preset-typescript",
35+
],
36+
},
37+
},
38+
},
39+
],
40+
},
41+
resolve: {
42+
extensions: [".tsx", ".ts", ".js"],
43+
},
44+
plugins: [
45+
new HtmlWebpackPlugin({
46+
template: "src/index.html",
47+
}),
48+
new webpack.HotModuleReplacementPlugin(),
49+
new ForkTsCheckerWebpackPlugin({
50+
async: false,
51+
}),
52+
new ESLintPlugin({
53+
extensions: ["js", "jsx", "ts", "tsx"],
54+
}),
55+
],
56+
devtool: "inline-source-map",
57+
devServer: {
58+
contentBase: path.join(__dirname, "build"),
59+
historyApiFallback: true,
60+
port: 4000,
61+
open: true,
62+
hot: true,
63+
},
64+
};
65+
66+
export default config;

webpack.prod.config.ts

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import path from "path";
2+
import webpack from "webpack";
3+
import HtmlWebpackPlugin from "html-webpack-plugin";
4+
import ForkTsCheckerWebpackPlugin from "fork-ts-checker-webpack-plugin";
5+
import ESLintPlugin from "eslint-webpack-plugin";
6+
import { CleanWebpackPlugin } from "clean-webpack-plugin";
7+
8+
const config: webpack.Configuration = {
9+
mode: "production",
10+
entry: "./src/index.tsx",
11+
output: {
12+
path: path.resolve(__dirname, "build"),
13+
filename: "[name].[contenthash].js",
14+
publicPath: "",
15+
},
16+
module: {
17+
rules: [
18+
{
19+
test: /\.(ts|js)x?$/i,
20+
exclude: /node_modules/,
21+
use: {
22+
loader: "babel-loader",
23+
options: {
24+
presets: [
25+
"@babel/preset-env",
26+
"@babel/preset-react",
27+
"@babel/preset-typescript",
28+
],
29+
},
30+
},
31+
},
32+
],
33+
},
34+
resolve: {
35+
extensions: [".tsx", ".ts", ".js"],
36+
},
37+
plugins: [
38+
new HtmlWebpackPlugin({
39+
template: "src/index.html",
40+
}),
41+
new ForkTsCheckerWebpackPlugin({
42+
async: false,
43+
}),
44+
new ESLintPlugin({
45+
extensions: ["js", "jsx", "ts", "tsx"],
46+
}),
47+
new CleanWebpackPlugin(),
48+
],
49+
};
50+
51+
export default config;

0 commit comments

Comments
 (0)