Гораздо более старая версия моего сайта показывается при перекомпоновке Production Bundle с Webpack. - PullRequest
0 голосов
/ 19 октября 2019

Я заметил, что когда я перестраиваю свой производственный комплект моего приложения node.js с помощью веб-пакета, сайт в браузере возвращается к более старой версии (300+ git фиксируются позже). Я использую pm2 для запуска своего веб-сайта на моем VPS.

Как сохранить самую старую версию в действии, пока не будет завершена новая производственная сборка?

Это мои настройки веб-пакета:

    const { resolve } = require('path');
    const webpack = require('webpack');
    const CompressionPlugin = require('compression-webpack-plugin');
    const ExtractTextPlugin = require('extract-text-webpack-plugin');
    const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

    const cssOutputLocation = process.env.NODE_ENV === 'production' ?
      'public/stylesheets/style-prod.css' :
      'stylesheets/style.css';

    const jsProdOutput = {
      filename: 'public/javascripts/build-prod.js',
      path: resolve(__dirname),
      publicPath: '/',
    };

    const jsDevOutput = {
      filename: 'javascripts/build.js',
      path: '/',
      publicPath: '/',
    };

    const jsOutputLocation = process.env.NODE_ENV === 'production' ? jsProdOutput : jsDevOutput;

    module.exports = {
      context: resolve(__dirname, 'src'),
      entry: [
        './index.jsx',
      ],
      output: jsOutputLocation,
      resolve: {
        extensions: ['.js', '.jsx'],
      },
      module: {
        rules: [
          {
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_components|public\/)/,
            loader: 'babel-loader',
            query: {
              presets: ['es2015', 'es2017'],
            },
          },
          {
            test: /\.js?$/,
            exclude: /(node_modules|bower_components|public\/)/,
            loader: 'babel-loader',
            query: {
              presets: ['es2015', 'es2017'],
            },
          },
          {
            test: /\.css$/,
            use: ExtractTextPlugin.extract({
              fallback: 'style-loader',
              use: 'css-loader',
            }),
          },
          {
            test: /\.scss$/,
            use: ExtractTextPlugin.extract({
              use: [
                {
                  loader: 'css-loader',
                },
                {
                  loader: 'sass-loader',
                },
              ],
              fallback: 'style-loader',
            }),
          },
        ],
      },
      plugins: [
        new webpack.NamedModulesPlugin(),
        new webpack.NoEmitOnErrorsPlugin(),
        new ExtractTextPlugin(cssOutputLocation),
        new BundleAnalyzerPlugin(),
        new webpack.ContextReplacementPlugin(/^\.\/locale$/, (context) => {
          if (!/\/moment\//.test(context.context)) { return; }
          // context needs to be modified in place
          Object.assign(context, {
            // include only CJK
            regExp: /^\.\/(nl|en-gb)/,
            // point to the locale data folder relative to moment's src/lib/locale
            request: '../../locale',
          });
        }),
      ],
    };

    if (process.env.NODE_ENV === 'production') {
      module.exports.plugins.push(new webpack.optimize.UglifyJsPlugin({
        compress: {
          warnings: false,
          screw_ie8: true,
          conditionals: true,
          unused: true,
          comparisons: true,
          sequences: true,
          dead_code: true,
          evaluate: true,
          if_return: true,
          join_vars: true,
        },
        output: {
          comments: false,
        },
      }));
      module.exports.plugins.push(new webpack.HashedModuleIdsPlugin());
      module.exports.plugins.push(new webpack.optimize.ModuleConcatenationPlugin());
      module.exports.plugins.push(
        new webpack.DefinePlugin(
          { 'process.env.NODE_ENV': JSON.stringify('production') },
        ),
      );
      module.exports.plugins.push(
        new CompressionPlugin({
          asset: '[path].gz[query]',
          algorithm: 'gzip',
          test: /\.js$|\.css$|\.html$|\.eot?.+$|\.ttf?.+$|\.woff?.+$|\.svg?.+$/,
          threshold: 10240,
          minRatio: 0.8,
        }),
      );
    }

    if (process.env.NODE_ENV !== 'production') {
      module.exports.entry.unshift(
        'react-hot-loader/patch',
        'react-hot-loader/babel',
        'webpack-hot-middleware/client',
      );
      module.exports.plugins.unshift(new webpack.HotModuleReplacementPlugin());
    }

1 Ответ

0 голосов
/ 19 октября 2019

Вы можете использовать заполнитель hash в подпорке filename вашей конфигурации вывода.

const jsProdOutput = {
  filename: 'public/javascripts/build-prod-[hash].js',
  path: resolve(__dirname),
  publicPath: '/',
};

При этом ваши сгенерированные файлы будут уникальными в каждой сборке и не будут переопределены.

...