在构建React模块时最小化了React错误#130

时间:2019-07-01 00:27:44

标签: reactjs

我要

  

最小化React错误#130

当我将我的react模块导入另一个应用程序时,该模块的版本可能会变旧或不正确。

我提到了类似的问题。

Uncaught Error: Minified React error #130

但是我想我已经正确设置了。

src /提取

import React, {Component} from 'react';
import MyFetch from './MyFetch';
const Fetch = (props) => (
     <div>
       <form onSubmit={props.onSubmit}>
            <input type="text" value={props.url} placeholder="enter a url" onChange={props.onChange}/>
        </form>
          <MyFetch url={props.url} method={props.method}/>
     </div>
)
export default Fetch;

src / index.js

import Fetch from './Fetch';

export default Fetch

dist / index.js

import React from 'react';
import { render} from 'react-dom';
import Fetch from '../src'
const App = () => (
    <Fetch />
);
render(<App />, document.getElementById("root"));

webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require("html-webpack-plugin");
const htmlWebpackPlugin = new HtmlWebpackPlugin({
    template: path.join(__dirname, "dist/index.html"),
    filename: "./index.html"
});
module.exports = {
    entry: path.join(__dirname, "dist/index.js"),
    output: {
      path: path.join(__dirname, './'),
      filename: 'index.js',
   },
    module: {
        rules: [
          {
            test: /\.js$/,

            exclude: /(node_modules|bower_components|build)/,
            use: {
              loader: 'babel-loader',
              options: { 
                presets: ['@babel/preset-env', '@babel/react'],
                plugins:['@babel/plugin-proposal-class-properties']
              }
            }
          }
        ]
      },
    plugins: [htmlWebpackPlugin],
    resolve: {
        extensions: [".js", ".jsx"]
    },
    devServer: {
        port: 3001
    }
};

1 个答案:

答案 0 :(得分:0)

已修复

plugins: [htmlWebpackPlugin,new webpack.DefinePlugin({
      'process.env': {
          NODE_ENV: JSON.stringify('development')
      }
  })]

React - Minified exception occurred