Skip to content

Commit 9c258bd

Browse files
committed
init
0 parents  commit 9c258bd

File tree

11 files changed

+4145
-0
lines changed

11 files changed

+4145
-0
lines changed

.babelrc

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"presets": ["@babel/preset-react", "@babel/typescript"],
3+
"plugins": ["@babel/proposal-class-properties", "@babel/proposal-object-rest-spread"]
4+
}

.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
dist/
2+
node_modules/
3+
4+
yarn-debug.log*
5+
yarn-error.log*

.prettierrc

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

package.json

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{
2+
"name": "webpack5-babel-typescript-react",
3+
"version": "0.0.1",
4+
"license": "MIT",
5+
"author": "Damian Pieczynski <piecyk@gmail.com>",
6+
"scripts": {
7+
"cleanCache": "rm -rf ./node_modules/.cache/webpack",
8+
"clean": "rm -rf ./dist && yarn run cleanCache",
9+
"dev": "run-p dev:*",
10+
"dev:webpack": "webpack-dev-server --mode development --content-base ./site",
11+
"dev:ts": "tsc --watch --preserveWatchOutput",
12+
"build": "yarn run clean && tsc && webpack --mode production"
13+
},
14+
"devDependencies": {
15+
"@babel/core": "^7.2.2",
16+
"@babel/plugin-proposal-class-properties": "^7.3.0",
17+
"@babel/plugin-proposal-object-rest-spread": "^7.3.1",
18+
"@babel/preset-react": "^7.0.0",
19+
"@babel/preset-typescript": "^7.1.0",
20+
"@types/react": "^16.7.22",
21+
"@types/react-dom": "^16.0.11",
22+
"babel-loader": "^8.0.5",
23+
"npm-run-all": "^4.1.5",
24+
"typescript": "^3.2.4",
25+
"webpack": "5.0.0-alpha.9",
26+
"webpack-cli": "^3.2.1",
27+
"webpack-dev-server": "^3.1.14"
28+
},
29+
"dependencies": {
30+
"react": "16.8.0-alpha.1",
31+
"react-dom": "16.8.0-alpha.1"
32+
}
33+
}

site/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="text/javascript" src="bundle.js"></script>
10+
</body>
11+
</html>

src/Foo.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export const add = (x: number, y: number) => x + y

src/index.tsx

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react'
2+
import ReactDOM from 'react-dom'
3+
4+
import { add } from 'Foo'
5+
import Example from 'lib/Example'
6+
7+
enum Check {
8+
Foo = 'Foo',
9+
Bar = 'Bar',
10+
}
11+
12+
const Foo = () => (
13+
<div style={{ fontSize: 24 }}>
14+
Hello: {Check.Bar} | {add(3, 2)}
15+
<Example />
16+
</div>
17+
)
18+
19+
ReactDOM.render(<Foo />, document.getElementById('root'))

src/lib/Example.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import React from 'react'
2+
import { useState } from 'react'
3+
4+
export default function Example() {
5+
// Declare a new state variable, which we'll call "count"
6+
const [count, setCount] = useState(0)
7+
8+
return (
9+
<div>
10+
<p>You clicked {count} times!</p>
11+
<button onClick={() => setCount(count + 1)}>Click me</button>
12+
</div>
13+
)
14+
}

tsconfig.json

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"compilerOptions": {
3+
"target": "esnext",
4+
"moduleResolution": "node",
5+
"jsx": "preserve",
6+
"allowJs": true,
7+
"noEmit": true,
8+
"strict": true,
9+
"isolatedModules": true,
10+
"esModuleInterop": true,
11+
"baseUrl": "./src"
12+
},
13+
"include": ["src"]
14+
}

webpack.config.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
const path = require('path')
2+
3+
const nodePathParts = ['./src', './node_modules'].map(p => path.resolve(p))
4+
5+
module.exports = {
6+
// https://github.com/webpack/changelog-v5/blob/master/README.md#persistent-caching
7+
cache: {
8+
type: 'filesystem',
9+
},
10+
entry: './src/index.tsx',
11+
output: {
12+
path: path.join(__dirname, '/dist'),
13+
filename: 'bundle.js',
14+
},
15+
resolve: {
16+
extensions: ['.ts', '.tsx', '.js', '.jsx'],
17+
modules: nodePathParts,
18+
},
19+
module: {
20+
rules: [
21+
{
22+
test: /\.tsx?$/,
23+
exclude: /node_modules/,
24+
use: {
25+
loader: 'babel-loader',
26+
},
27+
},
28+
],
29+
},
30+
}

0 commit comments

Comments
 (0)