Skip to content

Commit f9866ca

Browse files
committed
initial commit
0 parents  commit f9866ca

10 files changed

+242
-0
lines changed

.gitignore

+105
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
lerna-debug.log*
8+
package-lock.json
9+
10+
# Diagnostic reports (https://nodejs.org/api/report.html)
11+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
12+
13+
# Runtime data
14+
pids
15+
*.pid
16+
*.seed
17+
*.pid.lock
18+
19+
# Directory for instrumented libs generated by jscoverage/JSCover
20+
lib-cov
21+
22+
# Coverage directory used by tools like istanbul
23+
coverage
24+
*.lcov
25+
26+
# nyc test coverage
27+
.nyc_output
28+
29+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
30+
.grunt
31+
32+
# Bower dependency directory (https://bower.io/)
33+
bower_components
34+
35+
# node-waf configuration
36+
.lock-wscript
37+
38+
# Compiled binary addons (https://nodejs.org/api/addons.html)
39+
build/Release
40+
41+
# Dependency directories
42+
node_modules/
43+
jspm_packages/
44+
45+
# TypeScript v1 declaration files
46+
typings/
47+
48+
# TypeScript cache
49+
*.tsbuildinfo
50+
51+
# Optional npm cache directory
52+
.npm
53+
54+
# Optional eslint cache
55+
.eslintcache
56+
57+
# Microbundle cache
58+
.rpt2_cache/
59+
.rts2_cache_cjs/
60+
.rts2_cache_es/
61+
.rts2_cache_umd/
62+
63+
# Optional REPL history
64+
.node_repl_history
65+
66+
# Output of 'npm pack'
67+
*.tgz
68+
69+
# Yarn Integrity file
70+
.yarn-integrity
71+
72+
# dotenv environment variables file
73+
.env
74+
.env.test
75+
76+
# parcel-bundler cache (https://parceljs.org/)
77+
.cache
78+
79+
# Next.js build output
80+
.next
81+
82+
# Nuxt.js build / generate output
83+
.nuxt
84+
dist
85+
86+
# Gatsby files
87+
.cache/
88+
# Comment in the public line in if your project uses Gatsby and *not* Next.js
89+
# https://nextjs.org/blog/next-9-1#public-directory-support
90+
# public
91+
92+
# vuepress build output
93+
.vuepress/dist
94+
95+
# Serverless directories
96+
.serverless/
97+
98+
# FuseBox cache
99+
.fusebox/
100+
101+
# DynamoDB Local files
102+
.dynamodb/
103+
104+
# TernJS port file
105+
.tern-port

README.md

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# react-webpack-template
2+
Template for react and webpack

package.json

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"name": "reactwebpack",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"test": "echo \"Error: no test specified\" && exit 1"
8+
},
9+
"keywords": [],
10+
"author": "",
11+
"license": "ISC",
12+
"dependencies": {
13+
"react": "^18.2.0",
14+
"react-dom": "^18.2.0"
15+
},
16+
"devDependencies": {
17+
"@babel/core": "^7.20.2",
18+
"@babel/preset-env": "^7.20.2",
19+
"@babel/preset-react": "^7.18.6",
20+
"autoprefixer": "^10.4.13",
21+
"babel-loader": "^9.1.0",
22+
"css-loader": "^6.7.1",
23+
"html-webpack-plugin": "^5.5.0",
24+
"postcss": "^8.4.19",
25+
"postcss-loader": "^7.0.1",
26+
"style-loader": "^3.3.1",
27+
"tailwindcss": "^3.2.4",
28+
"webpack": "^5.75.0",
29+
"webpack-cli": "^4.10.0",
30+
"webpack-dev-server": "^4.11.1"
31+
}
32+
}

postcss.config.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
plugins: {
3+
tailwindcss: {},
4+
autoprefixer: {},
5+
},
6+
}

src/App.jsx

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
2+
import React from 'react';
3+
4+
5+
const App = () => {
6+
return (
7+
<div className="text-3xl font-bold underline">
8+
<h1>Hello World</h1>
9+
</div>
10+
);
11+
}
12+
13+
export default App;

src/index.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;

src/index.html

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
2+
<!DOCTYPE html>
3+
<html lang="en">
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Hello world</title>
9+
</head>
10+
<body>
11+
<div id="root"></div>
12+
13+
</body>
14+
</html>

src/index.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
2+
import React from 'react';
3+
import {createRoot} from 'react-dom/client';
4+
import App from './App';
5+
import './index.css';
6+
7+
const root = createRoot(document.getElementById('root'));
8+
root.render(<App />);

tailwind.config.js

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/** @type {import('tailwindcss').Config} */
2+
module.exports = {
3+
content: [
4+
'./src/**/*.{js,jsx,ts,tsx}',
5+
6+
],
7+
theme: {
8+
extend: {},
9+
},
10+
plugins: [],
11+
}

webpack.config.js

+48
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
const path = require('path');
2+
const HtmlWebpackPlugin = require('html-webpack-plugin');
3+
4+
module.exports = {
5+
mode: 'development',
6+
entry: './src/index.js',
7+
output: {
8+
path: path.resolve(__dirname, 'dist'),
9+
filename: 'bundle.js',
10+
},
11+
module: {
12+
rules: [
13+
{
14+
test: /\.jsx?$/,
15+
exclude: /node_modules/,
16+
use: {
17+
loader: 'babel-loader',
18+
options: {
19+
presets: ['@babel/preset-env', '@babel/preset-react'],
20+
},
21+
},
22+
},
23+
/* add tailwindcss */
24+
{
25+
test: /\.css$/,
26+
use: ['style-loader', 'css-loader', 'postcss-loader'],
27+
},
28+
29+
],
30+
},
31+
resolve: {
32+
extensions: ['.js', '.jsx'],
33+
},
34+
devServer: {
35+
static: {
36+
directory: path.join(__dirname, 'dist'),
37+
},
38+
compress: true,
39+
port: 3000,
40+
hot: true,
41+
open: true,
42+
},
43+
plugins: [
44+
new HtmlWebpackPlugin({
45+
template: './src/index.html',
46+
}),
47+
],
48+
};

0 commit comments

Comments
 (0)