反应库椭圆json出现在prod丛上

Question

我有一个react应用程序，当我生成prod包时，lib椭圆显示了json信息，如下所示：

带有问题的包文件：

 ...{type:"range",registry:!0,raw:"elliptic@^6.0.0",name:"elliptic",escapedName:"elliptic",rawSpec:"^6.0.0",saveSpec:null,fetchSpec:"^6.0.0"},_requiredBy:["/browserify-sign","/create-ecdh"],_resolved:"https:...my private repository.../elliptic/-/elliptic-6.5.2.tgz",_shasum:"05c5678d7173c049d8ca433552224a495d0e3762",_spec:"elliptic@^6.0.0",_where:"/var/lib/jenkins/folder/folder2/node_modules/browserify-sign",author:{name:"Fedor Indutny",email:"fedor@indutny.com"},bugs:{url:"https://github.com/indutny/elliptic/issues"}...

我不需要显示：_resolved:"https:...my私有_resolved

我的Webpack规则：

const path = require('path');
const ExtractTextWebpackPlugin = require('extract-text-webpack-plugin');
// const eslintFormatter = require('react-dev-utils/eslintFormatter');
const autoprefixer = require('autoprefixer');

const assetsPath = path.resolve(`${__dirname}/../../src/assets`);
const fontsPath = path.resolve(`${__dirname}/../../src/assets/fonts`);
const fileName = `${process.env.ROOT_PATH}assets/[name]-[hash:5].[ext]`;

const ifDev = (rules) => {
  if (process.env.NODE_ENV === 'development') {
    rules.rules.unshift({
      test: /\.js$/,
      use: ['source-map-loader'],
      enforce: 'pre',
      exclude: /node_modules/
    });
  }
  return rules;
};

const rules = {
  rules: [
    {
      test: /\.json$/,
      exclude: /node_modules/,
      use: 'json-loader'
    },
    {
      test: /\.(js|jsx)$/,
      exclude: /(node_modules).*/,
      use: [
        'babel-loader'
      ]
    },
    {
      test: /\.(jpg|png|svg)/,
      include: assetsPath,
      exclude: /node_modules/,
      use: {
        loader: 'file-loader',
        options: {
          name: fileName
        }
      }
    },
    {
      test: /\.(png|jpg|gif|svg)$/,
      exclude: /node_modules/,
      use: 'url-loader?limit=10000&name=assets/images/[name].[hash:8].[ext]'
    },
    {
      test: /\.(css|sass|scss)$/,
      use: [
        require.resolve('style-loader'),
        {
          loader: require.resolve('css-loader'),
          options: {
            importLoaders: 1
          }
        },
        {
          loader: require.resolve('postcss-loader'),
          options: {
            ident: 'postcss',
            plugins: () => [
              require('postcss-flexbugs-fixes'),
              autoprefixer({
                browsers: ['>1%', 'last 4 versions', 'Firefox ESR', 'not ie < 9'],
                flexbox: 'no-2009'
              })
            ]
          }
        }
      ]
    },
    {
      test: /\.less$/,
      use: ExtractTextWebpackPlugin.extract({
        fallback: 'style-loader',
        use: [
          {
            loader: 'css-loader',
            options: {
              url: false,
              minimize: true,
              sourceMap: true
            }
          },
          {
            loader: 'less-loader',
            options: {
              sourceMap: true
            }
          }
        ]
      })
    },
    {
      test: /\.(ico|pdf)/,
      include: assetsPath,
      exclude: /node_modules/,
      use: {
        loader: 'file-loader',
        options: {
          name: fileName
        }
      }
    },
    {
      test: /\.(eot|ttf|woff|woff2|otf|svg)(\?v=\d+\.\d+\.\d+)?$/,
      include: fontsPath,
      exclude: /node_modules/,
      use: 'url-loader?limit=0&name=/.../assets/fonts/[name].[ext]'
    } 
  ]
}; 
module.exports = ifDev(rules);

Webpack插件的相关部分：

...new CleanWebpackPlugin(['dist'], {
    root: path.resolve(__dirname, '../../')
  }),
  new ExtractTextWebpackPlugin({
    filename: 'styles.css'
  }),
  new CopyWebpackPlugin(copyPlugin()),
  new webpack.optimize.AggressiveMergingPlugin({
    minSizeReduce: 1.5,
    moveToParents: true
  }),
  new webpack.optimize.ModuleConcatenationPlugin(),
  new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',
    minChunks(module) {
      return module.context && module.context.includes('node_modules');
    }
  }),
  new webpack.optimize.CommonsChunkPlugin({
    name: 'manifest',
    minChunks: Infinity
  })....

我试过：https://github.com/headfire94/package-json-cleanup-loader

将构建突击队更改为：

"build:prod":“毫不相干的命令& npm运行构建:envConfig && this_PATH=./ webpack --config webpack.config.js

在规则的末尾还有一条新的规则：

  {
    test: /package\.json$/,
       loader: 'package-json-cleanup-loader'  
    }

如果没有成功，就会得到错误：

ERROR in ./node_modules/elliptic/package.json
Module parse failed: Unexpected token (2:10)
You may need an appropriate loader to handle this file type.
| {
|   "author": {
|     "name": "Fedor Indutny",
|     "email": "fedor@indutny.com"
 @ ./node_modules/elliptic/lib/elliptic.js 5:19-45
 @ ./node_modules/browserify-sign/browser/verify.js
 @ ./node_modules/browserify-sign/browser/index.js
 @ ./node_modules/crypto-browserify/index.js
 @ ./node_modules/node-rsa/src/utils.js
 @ ./node_modules/node-rsa/src/NodeRSA.js

有谁知道解决这个问题的替代办法吗？

Answer 1

使用package清理加载程序解决了问题，并将代码调整为：

Rule:
    {
       test: /package\.json$/,
       loader: ['json-loader', 'package-json-cleanup-loader']  
    }

npm脚本

build: "   ... && webpack --module-bind 'package.json=package-json-cleanup-loader' "