dancingCycle
/
sandbox-react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore(webpack-react-babel): add eslint

This commit is contained in:
dancingCycle 2024-02-15 21:58:53 +01:00
parent 659ba0fe95
commit 6bfc03ba2c
9 changed files with 3250 additions and 237 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
wbpck-rct-bbl-slnt/.eslintrc Normal file
View File

@ -0,0 +1,9 @@
{
"parser": "@babel/eslint-parser",
"extends": ["airbnb"],
"rules": {
"no-tabs": 0,
"no-mixed-spaces-and-tabs": 0
}
}

50
wbpck-rct-bbl-slnt/config/webpack.common.config.js Normal file
View File

@ -0,0 +1,50 @@
// generate a HTML5 file including all webpack bundles in the body using script tags
const HtmlWebpackPlugin = require('html-webpack-plugin');
// path is used to resolve properly across the OS
const path = require('path');
module.exports = {
// bundle *.js from this entry point
entry: path.resolve(__dirname, '../src/index.jsx'),
// create output file to be linked to index.html
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, '../dist'),
clean: true,
},
module: {
rules: [
{
// test all *.js using babel-loader
// test all *.jsx (e.g. React.js) using babel-loader
test: /\.(js|jsx)$/,
exclude: /node_modules/,
include: path.resolve(__dirname, '../src'),
use: {
loader: 'babel-loader',
options: {
presets: [
'@babel/preset-env',
'@babel/preset-react',
],
},
},
},
{
// test all *.css using style-loader and css-loader
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
],
},
resolve: {
extensions: ['*', '.js', '.jsx'],
},
plugins: [
// create a plugin instance so that you can use it several times anywhere
new HtmlWebpackPlugin({
title: 'Production',
template: path.resolve(__dirname, '../public/index.html'),
}),
],
};

49
wbpck-rct-bbl-slnt/config/webpack.common.js
View File

@ -1,49 +0,0 @@
//generate a HTML5 file including all webpack bundles in the body using script tags
const HtmlWebpackPlugin = require('html-webpack-plugin');
//path is used to resolve properly across the OS
const path = require('path');
module.exports = {
//bundle *.js from this entry point
entry: path.resolve(__dirname, '../src/index.jsx'),
//create output file to be linked to index.html
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, '../dist'),
clean: true,
},
module: {
rules: [
{
//test all *.js using babel-loader
//test all *.jsx (e.g. React.js) using babel-loader
test: /\.(js|jsx)$/,
exclude: /node_modules/,
include: path.resolve(__dirname, '../src'),
use: {
loader: "babel-loader",
options: {
presets: [
"@babel/preset-env",
"@babel/preset-react",
],
},
},
},
{
//test all *.css using style-loader and css-loader
test: /\.css$/i,
use: ["style-loader", "css-loader"],
},
]
},
resolve: {
extensions: ['*', '.js', '.jsx'],
},
plugins: [
// create a plugin instance so that you can use it several times anywhere
new HtmlWebpackPlugin({
title: 'Production',
template: path.resolve(__dirname, "../public/index.html")
}),
],
};

22
wbpck-rct-bbl-slnt/config/webpack.dev.config.js Normal file
View File

@ -0,0 +1,22 @@
// path is used to resolve properly across the OS
const path = require('path');
const { merge } = require('webpack-merge');
const common = require('./webpack.common.config');
// merge() calls in the environment-specific configuration to include commons
module.exports = merge(common, {
// set development mode
mode: 'development',
// enable strong source mapping
devtool: 'inline-source-map',
devServer: {
static: path.resolve(__dirname, '../dist'),
/*
When using the HTML5 History API,
the index.html page will likely have to be served in place of any 404 responses.
Enable devServer.historyApiFallback by setting it to true.
*/
historyApiFallback: true,
port: 8080,
open: true,
},
});

18
wbpck-rct-bbl-slnt/config/webpack.dev.js
View File

@ -1,18 +0,0 @@
//path is used to resolve properly across the OS
const path = require('path');
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
//merge() calls in the environment-specific configuration to include commons
module.exports = merge(common, {
//set development mode
mode: 'development',
//enable strong source mapping
devtool: 'inline-source-map',
devServer: {
static: path.resolve(__dirname, '../dist'),
//When using the HTML5 History API, the index.html page will likely have to be served in place of any 404 responses. Enable devServer.historyApiFallback by setting it to true.
historyApiFallback: true,
port: 8080,
open: true,
},
});

9
wbpck-rct-bbl-slnt/config/webpack.prod.config.js Normal file
View File

@ -0,0 +1,9 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.config');
module.exports = merge(common, {
mode: 'production',
// source maps encouraged in production
// choose mapping with fairly quick build speed like source-map
devtool: 'source-map',
});

8
wbpck-rct-bbl-slnt/config/webpack.prod.js
View File

@ -1,8 +0,0 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
module.exports = merge(common, {
mode: 'production',
//source maps encouraged in production
//choose mapping with fairly quick build speed like source-map
devtool: 'source-map',
});

3306
wbpck-rct-bbl-slnt/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

16
wbpck-rct-bbl-slnt/package.json
View File

@ -14,25 +14,31 @@
"node": ">=18.17.0"
},
"scripts": {
"start": "webpack serve --config config/webpack.dev.js",
"build": "webpack --config config/webpack.prod.js"
"start": "webpack serve --config config/webpack.dev.config.js",
"build": "webpack --config config/webpack.prod.config.js",
"lint": "eslint .",
"lint:fix": "eslint --fix ."
},
"devDependencies": {
"@babel/core": "7.23.9",
"@babel/eslint-parser": "7.23.10",
"@babel/plugin-transform-runtime": "7.23.9",
"@babel/preset-env": "7.23.9",
"@babel/preset-react": "7.23.3",
"@babel/runtime": "7.23.9",
"babel-loader": "9.1.3",
"css-loader": "6.10.0",
"html-webpack-plugin": "5.6.0",
"eslint": "8.56.0",
"eslint-config-airbnb": "19.0.4",
"eslint-webpack-plugin": "4.0.1",
"style-loader": "3.3.4",
"webpack": "5.90.2",
"webpack-cli": "5.1.4",
"webpack-dev-server": "5.0.1",
"webpack-merge": "5.10.0"
"webpack-dev-server": "5.0.1"
},
"dependencies": {
"webpack-merge": "5.10.0",
"html-webpack-plugin": "5.6.0",
"prop-types": "15.8.1",
"react": "18.2.0",
"react-dom": "18.2.0"