Приложение React, длинный пакет времени загрузки. js файл большого размера - PullRequest
0 голосов
/ 26 февраля 2020

мой сайт загружается так долго, это мое первое приложение в производстве, я даже не знаю, как я могу запустить его в производственном режиме, пакетный файл имеет 3,8 МБ, поэтому он довольно большой. Изображения загружаются медленно, но они загружаются динамически c, скорость Google показывает 3/100, поэтому это ужасно

The load time

Я думаю, что мой Конфигурация webpack неверна, и, возможно, я должен что-то сделать с фотографиями, надеюсь, вы мне поможете!

webpack.config

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const webpack = require('webpack');

const outputDirectory = 'dist';

module.exports = {
  optimization: {
      minimizer: [
        // we specify a custom UglifyJsPlugin here to get source maps in production
        new UglifyJsPlugin({
          cache: true,
          parallel: true,
          uglifyOptions: {
            compress: false,
            ecma: 6,
            mangle: true
          },
          sourceMap: true
        })
      ]
    },
  entry: ['babel-polyfill', './src/client/index.js'],
  output: {
     path: path.join(__dirname, 'dist'),
     filename: 'bundle.js',
     publicPath: '/public/'
  },
  module: {
    rules: [{
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      },
      {
        test: /\.(png|woff|woff2|eot|ttf|svg|gif|jpg)$/,
        loader: 'url-loader?limit=10000000'
      }
    ]
  },
  resolve: {
    extensions: ['*', '.js', '.jsx']
  },
  devServer: {
    port: 3000,
    historyApiFallback: true,
    contentBase: './',
    hot: true,
    proxy: {
      //'/': 'http://localhost:8080',
      '/api': 'http://localhost:8080',
      '/src/client/upload': 'http://localhost:3000',
    }
  },
  plugins: [
    new CleanWebpackPlugin([outputDirectory]),
    new HtmlWebpackPlugin({
      template: './public/index.html',
    })
  ]
};

Вы можете увидеть веб-сайт: https://piesfajnyjest.com

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...