Skip to content

Commit

Permalink
Modified webpack.config.js and package.json to optimise the project b…
Browse files Browse the repository at this point in the history
…uild.
  • Loading branch information
YaroslavKSE committed Jun 19, 2024
1 parent c10d458 commit 459af7c
Show file tree
Hide file tree
Showing 3 changed files with 244 additions and 18 deletions.
199 changes: 199 additions & 0 deletions react-frontend/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

18 changes: 12 additions & 6 deletions react-frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,13 @@
"description": "- react@18",
"main": "index.js",
"scripts": {
"start": "webpack serve --config ./webpack.config.js --mode development",
"start": "webpack serve --env dev",
"build": "webpack --env production",
"lint": "eslint src/**/*.{js,jsx}",
"lint:fix": "eslint --fix src/**/*.{js,jsx}",
"predeploy": "npm run build",
"lint:fix": "eslint --fix",
"lint": "eslint ./src/*",
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build",
"build": "webpack --mode production"
"build-storybook": "storybook build"
},
"author": "",
"license": "ISC",
Expand Down Expand Up @@ -39,6 +39,7 @@
"@storybook/react-webpack5": "^8.1.5",
"@storybook/test": "^8.1.5",
"babel-loader": "^9.1.3",
"clean-webpack-plugin": "^4.0.0",
"css-loader": "^7.1.2",
"eslint": "^8.57.0",
"eslint-config-prettier": "^9.1.0",
Expand All @@ -56,5 +57,10 @@
"webpack": "^5.91.0",
"webpack-cli": "^5.1.4",
"webpack-dev-server": "^5.0.4"
}
},
"browserslist": [
">0.2%",
"not dead",
"not op_mini all"
]
}
45 changes: 33 additions & 12 deletions react-frontend/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,22 @@
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ESLintPlugin = require('eslint-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')

module.exports = (env) => {
return {
mode: env.dev ? 'development' : 'production',
entry: './src/index.js',
output: {
filename: 'main.js',
path: path.resolve(__dirname, 'dist')
filename: env.dev ? '[name].js' : '[name].[contenthash].js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/'
},
devtool: env.dev ? 'eval-source-map' : 'source-map',
module: {
rules: [
{
test: /.(js|jsx)$/,
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
Expand All @@ -27,32 +29,51 @@ module.exports = (env) => {
},
{
test: /\.css$/,
use: [
'style-loader',
'css-loader' // for styles
]
use: ['style-loader', 'css-loader']
},
{
test: /\.(png|svg|jpg|jpeg|gif)$/,
type: 'asset/resource'
}
]
},
optimization: {
splitChunks: {
chunks: 'all'
},
runtimeChunk: 'single'
},
plugins: [
new CleanWebpackPlugin(),
new ESLintPlugin({
exclude: ['node_modules', 'dist'],
context: path.resolve(__dirname, 'src')
}),
new HtmlWebpackPlugin({
template: 'public/index.html'
template: 'public/index.html',
minify: !env.dev && {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true
}
})
],
devServer: {
static: {
directory: path.join(__dirname, 'dist')
},
allowedHosts: 'all',
compress: false,
compress: true,
port: 3000,
historyApiFallback: {
index: 'index.html'
}
historyApiFallback: true,
hot: true
}
}
}

0 comments on commit 459af7c

Please sign in to comment.