到达路由器-生产版本无法正常工作

时间:2019-12-03 17:51:09

标签: javascript webpack reach-router

我使用的是Reach Router 1.2.1,到目前为止,它可以在开发模式下工作。

但是,如果我这样做yarn build,该页面将为空白,并且不会出现错误(在Google Chrome中)。

这是我的webpack配置:

const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
const lessToJS = require('less-vars-to-js');
const fs = require('fs');

const themeVariables = lessToJS(
  fs.readFileSync(path.resolve(__dirname, './assets/antd-custom.less'), 'utf8')
);

module.exports = (env = {}) => {
  const config = {
    entry: ['./src/main.less', './src/polyfill.js', './src/main.jsx'],
    output: {
      path: path.resolve(__dirname, `./html/${env.branch || 'master'}`),
      filename: 'kt-reactapp.js',
      library: 'ktReactApp',
      libraryExport: 'default',
      libraryTarget: 'umd',
    },
    mode: env.mode || 'development',
    devtool: 'eval',
    resolve: {
      extensions: ['.js', '.jsx', '.css', '.sass', '.scss', '.less'],
    },
    plugins: [
      new CopyWebpackPlugin([
        { from: 'dev/static/', to: 'static/' },
        'dev/index.html',
      ]),
    ],
    module: {
      rules: [
        {
          test: [/\.js$/, /\.jsx$/],
          exclude: /node_modules/,
          use: 'babel-loader',
        },
        {
          test: /\.css$/i,
          use: [
            {
              loader: 'style-loader',
            },
            {
              loader: 'css-loader',
            },
          ],
        },
        {
          test: /\.less$/i,
          use: [
            {
              loader: 'style-loader', // creates style nodes from JS strings
            },
            {
              loader: 'css-loader', // translates CSS into CommonJS
              options: {
                sourceMap: true,
                import: false,
              },
            },
            {
              loader: 'less-loader', // compiles Less to CSS
              options: {
                sourceMap: true,
                javascriptEnabled: true,
                outputStyle: env === 'production' ? 'compressed' : 'nested',
                modifyVars: themeVariables,
              },
            },
          ],
        },
        {
          test: /\.(jpe?g|png|gif)$/i,
          use: [
            {
              loader: 'image-webpack-loader',
              options: {
                gifsicle: {
                  interlaced: false,
                },
                optipng: {
                  optimizationLevel: 7,
                },
              },
            },
            {
              loader: 'file-loader',
            },
          ],
        },
        {
          test: /\.(svg)$/i,
          use: [
            {
              loader: 'file-loader',
            },
          ],
        },
        {
          test: /\.(woff(2)?|ttf|eot|otf|svg)(\?v=\d+\.\d+\.\d+)?$/,
          use: [
            {
              loader: 'file-loader',
              options: {
                name: '[name].[ext]',
                outputPath: 'fonts/',
              },
            },
          ],
        },
      ],
    },
    watchOptions: {
      poll: 2000,
      ignored: ['/node_modules/'],
    },
    devServer: {
      contentBase: path.resolve(__dirname, './dev/'),
      watchContentBase: true,
      disableHostCheck: true,
      host: '127.0.0.1',
      port: 8000,
      // public: process.env.webpack_public_address || null,
      overlay: true,
    },
  };

  if (env.mode === 'development') {
    config.entry.unshift(
      'webpack/hot/only-dev-server',
      'react-hot-loader/patch'
    );
    config.resolve.alias = { 'react-dom': '@hot-loader/react-dom' };
    config.module.rules.unshift({
      enforce: 'pre',
      test: [/\.js$/, /\.jsx$/],
      exclude: /node_modules/,
      loader: 'eslint-loader',
      options: {
        failOnError: env.mode === 'production',
      },
    });
  }

  if (env.analyze === 'true') {
    config.plugins.push(
      new BundleAnalyzerPlugin({
        analyzerMode: 'static',
      })
    );
  }

  return config;
};

有人可以帮忙吗?

0 个答案:

没有答案