@DenisLopatin

Почему в production моде webpack'a отваливается часть функционала сайта?

Есть учебный сайт, на котором я по большей части знакомлюсь в webpack'ом. Суть в чем, сайт использует библиотеку materialize и в development сборке все работает, но стоит сделать production сборку, как часть функционала отвалится ( причем не значительная часть UI, например текст перестанет исчезать с input по клику и прочее) В консоли 0 ошибок при сборке и в браузере. С чем это может быть вообще связано? Ну каким образом prod мод может взять и отвалить у стороннего скрипта ( инпуты инициализируются при помощи materialize и классы добавляют по клику тоже при помощи него) часть функционала и при этом вывести пустую консоль типо все окей.

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');

const isDev = process.env.NODE_ENV === 'development';
const isProd = !isDev;

module.exports = {
    mode: 'development',
    target: process.env.NODE_ENV === "development" ? "web" : "browserslist",
    context: path.resolve(__dirname, 'src'),
    entry: {
        polyfill: '@babel/polyfill',
        main: path.resolve(__dirname, 'src/scripts', 'index.js')
    },
    output: {
        filename: '[name].[contenthash].js',
        path: path.resolve(__dirname, 'dist'),
    },
    devtool: isDev ? 'inline-source-map' : false,
    devServer: {
        publicPath: '/',
        contentBase: path.join(__dirname, 'dist'),
        compress: true,
        port: 9000,
        open: true,
        watchContentBase: true,
        hot: true
    },
    module: {
        rules: [
            {
                test: /\.s[ac]ss$/i,
                use: [
                    isDev ? 'style-loader' : MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader',
                ],
            },
            {
                test: /\.css$/i,
                use: [
                    isDev ? 'style-loader' : MiniCssExtractPlugin.loader,
                    'css-loader'
                ],
            },
            {
                test: /\.m?js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            },
            {
                test: /\.(ttf|eot|svg|png|jpg|gif|ico)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'file-loader'
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/i,
                type: 'asset/resource',
            },
        ],
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            template: path.resolve('src', 'index.html'),
        }),
        new MiniCssExtractPlugin({
            filename: '[name].[contenthash].style.css',
        })
    ],
    optimization: {
        minimize: isProd,
        minimizer: [
            new CssMinimizerPlugin()
        ],
    }
}


{
  "name": "avia_tickets",
  "version": "1.0.0",
  "description": "Avia tickets application for web",
  "main": "index.js",
  "scripts": {
    "dev": "cross-env NODE_ENV='development' webpack --mode=development",
    "prod": "cross-env NODE_ENV='production' webpack --mode=production",
    "start": "cross-env NODE_ENV='development' webpack serve"
  },
  "browserslist": [
    "last 2 version",
    "> 1%"
  ],
  "author": "Denis Lopatin",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/preset-env": "^7.12.7",
    "babel-loader": "^8.2.2",
    "clean-webpack-plugin": "^3.0.0",
    "cross-env": "^7.0.3",
    "css-loader": "^5.0.1",
    "css-minimizer-webpack-plugin": "^1.1.5",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^4.5.0",
    "mini-css-extract-plugin": "^1.3.2",
    "sass": "^1.29.0",
    "sass-loader": "^10.1.0",
    "style-loader": "^2.0.0",
    "webpack": "^5.9.0",
    "webpack-cli": "^4.2.0",
    "webpack-dev-server": "^3.11.0"
  },
  "dependencies": {
    "@babel/polyfill": "^7.12.1",
    "axios": "^0.21.0",
    "materialize-css": "^1.0.0-rc.2"
  }
}
  • Вопрос задан
  • 169 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы