Webpack-无法读取未定义的属性'func'(var func = _react.PropTypes.func)

时间:2018-07-20 09:34:48

标签: reactjs webpack config typeerror react-proptypes

运行应用程序时,出现标题问题中提到的错误。注意:我没有在组件中使用propTypes,我知道propTypes在新React中的单独库中。但是不知道这个错误是从哪里产生的。大概有模块版本的东西吗?我将为package.jsonwebpack.config.js提供代码。...

这里有package.json个依赖项和devDependencies:

"devDependencies": {
    "babel-core": "^6.26.3",
    "babel-eslint": "^8.2.5",
    "babel-loader": "^7.1.4",
    "babel-minify-webpack-plugin": "^0.3.1",
    "babel-plugin-module-resolver": "^3.1.1",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-es2015-destructuring": "^6.23.0",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "clean-webpack-plugin": "^0.1.19",
    "css-loader": "^0.28.11",
    "eslint": "^5.0.1",
    "eslint-import-resolver-babel-module": "^4.0.0",
    "eslint-import-resolver-webpack": "^0.10.1",
    "eslint-loader": "^2.0.0",
    "eslint-plugin-import": "^2.13.0",
    "eslint-plugin-react": "^7.10.0",
    "file-loader": "^1.1.11",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "json-loader": "^0.5.7",
    "mini-css-extract-plugin": "^0.4.1",
    "node-sass": "^4.9.2",
    "sass-loader": "^7.0.3",
    "style-loader": "^0.21.0",
    "uglifyjs-webpack-plugin": "^1.2.7",
    "webpack": "^4.16.1",
    "webpack-cli": "^3.0.8",
    "webpack-dev-server": "^3.1.4"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "babel-polyfill": "^6.26.0",
    "react": "^16.4.1",
    "react-bootstrap": "^0.32.1",
    "react-document-title": "^2.0.3",
    "react-dom": "^16.4.1",
    "react-facebook-login": "^4.0.1",
    "react-google-login": "^3.2.1",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "react-stormpath": "^2.0.1",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  }

这是webpack.config.js

'use strict';

const path = require('path');
const webpack = require('webpack');
const HtmlWebPackPlugin = require("html-webpack-plugin");
const CleanWebpackPlugin = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

const paths = {
    SRC: path.resolve(__dirname, 'src'),     // Source folder path
    DIST: path.resolve(__dirname, 'dist'),   // Webpack bundling destination folder
};


// Webpack configuration
module.exports = (env, options) => {
    return {
        mode: options.mode,
        entry: path.join(paths.SRC, 'index.jsx'),
        output: {
            path: paths.DIST,
            filename: 'index.bundle.js'
        },
        plugins: [
            new HtmlWebPackPlugin({
                hash: true,
                template: path.join(paths.SRC, 'index.html'),
                filename: "./index.html"
            }),
            new MiniCssExtractPlugin({
                filename: 'index.bundle.css'
            }),
            new webpack.LoaderOptionsPlugin({
                options: {}
            }),
            new webpack.HotModuleReplacementPlugin(),
            new CleanWebpackPlugin(['dist'])
        ],
        // Loaders configuration
        module: {
            rules: [
                {
                    enforce: 'pre',
                    test: /\.(js|jsx)$/,
                    exclude: /node_modules/,
                    loader: 'eslint-loader'
                },
                {
                    test: /\.(js|jsx)$/,
                    include: paths.SRC,
                    exclude: /node_modules/,
                    loader: 'babel-loader',
                },
                {
                    test: /\.json?$/,
                    exclude: /node_modules/,
                    loader: 'json-loader'
                },
                {
                    test: /\.html$/,
                    exclude: /node_modules/,
                    use: [
                        {
                            loader: "html-loader",
                            options: {minimize: true}
                        }
                    ]
                },
                {
                    test: /(\.css|\.scss)$/,
                    exclude: /node_modules/,
                    use: [
                        MiniCssExtractPlugin.loader,
                        {
                            loader: "css-loader",
                            options: {
                                minimize: true,
                                sourceMap: true
                            }
                        },
                        {
                            loader: "sass-loader"
                        }
                    ]
                },
                {
                    test: /\.(jpe?g|png|gif)$/i,
                    loader: "file-loader"
                },
                {
                    test: /\.(woff|ttf|otf|eot|woff2|svg)$/i,
                    loader: "file-loader"
                }
            ]
        },
        stats: {
            colors: true,
            warnings: false
        },
        resolve: {
            extensions: ['.js', '.jsx', '.css', '.scss']
        },
        devServer: {
            port: 8081,
            historyApiFallback: true
        }
    };
};

0 个答案:

没有答案