React 16v - Uncaught TypeError:无法读取属性' bool'未定义的

时间:2018-02-08 07:06:19

标签: reactjs react-16

我将我的项目的反应版本从15.3.1更新为16.2.0。我收到以下运行时错误消息。

Uncaught TypeError: Cannot read property 'bool' of undefined
    at eval (Transition.js?0efa:259)
    at Object.<anonymous> (bundle.js:4059)
    at __webpack_require__ (bundle.js:1337)
    at fn (bundle.js:744)
    at eval (398:19)
    at Object.<anonymous> (bundle.js:3348)
    at __webpack_require__ (bundle.js:1337)
    at fn (bundle.js:744)
    at eval (99:30)
    at Object.<anonymous> (bundle.js:1647)

我逐渐完成了更新,应用程序在15.6.2中运行良好。我将其更新为16.0.0后,错误开始出现。我将其更新为16.2.0,希望能解决它。但没有运气。我的webpack.config.js和package.json在

之下

的package.json

{
    "name": "myProject",
    "version": "28.0.0",
    "description": "New front end",
    "main": "main.js",
    "scripts": {
        "test": "jest",
        "test-coverage": "jest --coverage",
        "dev": "webpack --config webpack.config.js -d --watch",
        "build": "webpack --config ./webpack.config.production.js --progress -p",
        "start": "webpack-dev-server --config ./webpack.config.js --hot"
    },
    "repository": "",
    "author": "Sarani",
    "license": "BSD",
    "dependencies": {
        "babel": "~6.5.2",
        "babel-core": "~6.13.2",
        "babel-loader": "~6.2.4",
        "babel-polyfill": "~6.16.0",
        "babel-preset-es2015": "~6.13.2",
        "babel-preset-react": "~6.11.1",
        "create-react-class": "^15.6.3",
        "css-loader": "~0.18.0",
        "file-loader": "~0.9.0",
        "isomorphic-fetch": "~2.2.1",
        "json-loader": "~0.5.4",
        "less": "~2.7.1",
        "less-loader": "~2.2.3",
        "moment-range": "~3.0.3",
        "moment-timezone": "~0.5.13",
        "prop-types": "^15.6.0",
        "react": "^16.0.0",
        "react-bootstrap": "~0.30.2",
        "react-dom": "^16.0.0",
        "react-redux": "~4.4.5",
        "react-router": "^3.2.0",
        "redux": "~3.5.2",
        "redux-immutable-state-invariant": "~1.2.3",
        "redux-thunk": "~2.1.0",
        "style-loader": "~0.13.1",
        "url-loader": "~0.5.7",
        "webpack": "^3.10.0"
    },
    "devDependencies": {
        "babel-eslint": "~6.1.2",
        "babel-jest": "~14.1.0",
        "eslint": "~3.5.0",
        "eslint-config-airbnb": "~11.1.0",
        "eslint-loader": "~1.5.0",
        "eslint-plugin-import": "~1.15.0",
        "eslint-plugin-jsx-a11y": "~2.2.2",
        "eslint-plugin-react": "~6.2.2",
        "gulp": "~3.9.1",
        "gulp-csslint": "~1.0.0",
        "gulp-watch": "~4.3.10",
        "jest": "~14.1.0",
        "jest-cli": "~14.1.0",
        "react-a11y": "~0.3.3",
        "react-addons-test-utils": "~15.3.2",
        "react-test-renderer": "~15.3.1",
        "redux-mock-store": "~1.2.1",
        "webpack-dev-server": "~1.14.1"
    },
    "jest": {
        "automock": false,
        "moduleNameMapper": {
            "^.+\\.(css|less)$": "<rootDir>/__mocks__/styleMock.js",
            "^.+\\.(gif|ttf|eot|svg)$": "<rootDir>/__mocks__/fileMock.js",
            "^config$": "<rootDir>/__mocks__/configMock.js"
        },
        "moduleFileExtensions": [
            "js",
            "jsx"
        ]
    }
}

webpack.config.js

var webpack = require('webpack');
var path = require('path');

module.exports = {
    devtool: 'eval-source-map',
    entry: {
        bundle: ['babel-polyfill', './Main.js'],
        bundleIntegrated: ['babel-polyfill', './MainIntegrated.js']
    },
    output: {
        path: path.resolve(__dirname, '../assets/myProject'),
        filename: '../assets/myProject/[name].js'
    },
    target: 'web',
    devServer: {
        inline: true,
        port: 8080,
        proxy: {
            '/myct/**': {
                target: 'http://localhost:9000',
                secure: false,
                changeOrigin: true
            }
        }
    },
    plugins: [
        new webpack.optimize.OccurrenceOrderPlugin(),
        new webpack.HotModuleReplacementPlugin()
    ],
    resolve: {
        extensions: ['.js', '.jsx'],
        alias: {
            config: path.join(__dirname, 'config/config.dev')
        }
    },
    module: {
        rules: [
                {
                    test: /.(js|jsx)$/,
                    enforce: 'pre',
                    exclude: /node_modules/,
                    use: [
                            {
                                loader: "eslint-loader",
                            }
                        ],
                },
                {
                    test: /\.(js|jsx)$/,
                    exclude: /(node_modules|__tests__)/,
                    loader: "babel-loader",
                },
                {
                    test: /\.css$/,
                    use: [
                            "style-loader",
                            "css-loader",
                        ],
                },
                {
                    test: /\.less$/,
                    use: [
                            "style-loader",
                            "css-loader",
                            "less-loader",
                        ],
                },
                {
                    test: /\.woff($|\?)|\.woff2($|\?)|\.ttf($|\?)|\.eot($|\?)|\.svg($|\?)/,
                    use: [
                            {
                                loader: "file-loader?name=../assets/myProject/fonts/[name].[ext]",
                            },
                        ],
                },
        ]
    }
}

有关如何解决此问题的任何想法。在此先感谢:)

2 个答案:

答案 0 :(得分:1)

谢谢大家的帮助。我设法通过将以下内容更新到最新版本来解决问题。可以找到解决方案here

"react": "latest",
"react-dom": "latest",
"react-bootstrap": "latest",
"react-router-dom": "latest"

答案 1 :(得分:1)

我有同样的问题。

如果运行 public static Matrix getPerspectiveMatrix() { double far = 100; double near = 0.1; return new Matrix( new double[][] { {1,0,0,0}, {0,1,0,0}, {0,0,-((far+near)/(far-near)),-((2*far*near)/(far-near))}, {0,0,1,0} } ); } public static Point3D transformPoint(Point3D scale, Point3D rotation, Point3D translation, Point3D point) { Matrix m = Matrix.mul(Matrix.getTransformationMatrix(scale, rotation, translation), point.toMatrix()); m.getArray()[0][0] = m.getArray()[0][0] / m.getArray()[3][0]; m.getArray()[1][0] = m.getArray()[1][0] / m.getArray()[3][0]; m.getArray()[2][0] = m.getArray()[2][0] / m.getArray()[3][0]; return m.toPoint3D(); } ,将看到以下内容:

yarn info react-bootstrap peerDependencies

因此,请确保版本正确。

我通过运行{ react: '>=16.8.0', 'react-dom': '>=16.8.0' } yarn add react@latest来修复它。另外,由于版本yarn add react-dom@latest引发了不同的错误,我将react-bootstrap设置为0.32.4

1.0.0