psmattas/Netflix-Clone
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed webpack warnings

Browse Source
This commit is contained in:
andres alcocer
2022-11-25 15:34:41 -05:00
parent 65f64f7c77
commit 510343d772
3 changed files with 1112 additions and 2722 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3714
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

11
package.json
View File

@@ -10,11 +10,6 @@
"run:prod": "webpack serve --mode production --open",
"lint": "eslint --fix . && echo 'Lint complete.'"
},
"engines": {
"node": "v14.15.4",
"npm": "7.24.0",
"watch": "watch 'clear && npm run -s test | tap-nirvana && npm run -s lint' src"
},
"author": "Andres Alcocer",
"license": "ISC",
"dependencies": {
@@ -46,6 +41,7 @@
"clean-webpack-plugin": "^4.0.0",
"copy-webpack-plugin": "^11.0.0",
"css-loader": "^6.7.2",
"css-minimizer-webpack-plugin": "^4.2.2",
"eslint": "^8.28.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-prettier": "^8.5.0",
@@ -54,22 +50,19 @@
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.31.11",
"eslint-plugin-react-hooks": "^4.6.0",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^6.2.0",
"html-loader": "^4.2.0",
"html-webpack-plugin": "^5.5.0",
"image-webpack-loader": "^8.1.0",
"mini-css-extract-plugin": "^2.7.0",
"node-sass": "^8.0.0",
"optimize-css-assets-webpack-plugin": "^6.0.1",
"prettier": "^2.8.0",
"react-owl-carousel2": "^0.3.0",
"sass-loader": "^13.2.0",
"style-loader": "^3.3.1",
"svg-inline-loader": "^0.8.2",
"svg-react-loader": "^0.4.6",
"tap-nirvana": "^1.1.0",
"uglifyjs-webpack-plugin": "^2.2.0",
"terser-webpack-plugin": "^5.3.6",
"watch": "^1.0.2",
"webpack": "^5.75.0",
"webpack-cli": "^5.0.0",

109
webpack.config.js
View File

@@ -1,9 +1,12 @@
const HtmlWebPackPlugin = require('html-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
const TerserPlugin = require('terser-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const dotenv = require('dotenv')
const webpack = require('webpack')
const prod =
(process.env.NODE_ENV ? process.env.NODE_ENV : '').trim() === 'production'
const path = require('path')
@@ -23,6 +26,7 @@ module.exports = () => {
optimization: {
runtimeChunk: 'single',
moduleIds: 'deterministic',
minimizer: [`...`, new CssMinimizerPlugin()],
splitChunks: {
cacheGroups: {
vendor: {
@@ -30,61 +34,18 @@ module.exports = () => {
name: 'vendors',
chunks: 'all',
},
styles: {
name: 'styles',
type: 'css/mini-extract',
chunks: 'all',
enforce: true,
},
},
},
},
mode: prod ? 'production' : 'development',
// Enable sourcemaps for debugging webpack's output.
devtool: prod ? 'none' : 'eval-source-map',
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
},
},
{
test: /\.svg$/,
exclude: /node_modules/,
use: {
loader: 'svg-react-loader',
},
},
{
test: /\.css$/,
include: /node_modules/,
use: ['style-loader', 'css-loader'],
},
{
test: /\.scss$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: '../',
},
},
'css-loader',
'sass-loader',
],
},
{
test: /\.(gif|png|jpe?g)$/i,
use: [
'file-loader',
{
loader: 'image-webpack-loader',
options: {
bypassOnDebug: true, // webpack@1.x
disable: true, // webpack@2.x and newer
},
},
],
},
],
},
devServer: {
historyApiFallback: true,
},
@@ -108,9 +69,57 @@ module.exports = () => {
],
}),
new MiniCssExtractPlugin({
filename: 'main.css',
filename: '[name].css',
}),
new CleanWebpackPlugin(),
],
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
},
},
{
test: /\.svg$/,
exclude: /node_modules/,
use: {
loader: 'svg-react-loader',
},
},
{
test: /\.css$/i,
use: [MiniCssExtractPlugin.loader, 'css-loader'],
},
{
test: /\.scss$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: '../',
},
},
'css-loader',
'sass-loader',
],
},
{
test: /\.(gif|png|jpe?g)$/i,
use: [
'file-loader',
{
loader: 'image-webpack-loader',
options: {
bypassOnDebug: true,
disable: true,
},
},
],
},
],
},
}
}