Compiled react with browserify and babel says : ReferenceError: React is not defined

Question

问题：没有构建错误，但是当尝试在浏览器上使用该文件时，控制台显示：ReferenceError: React is not defined.

使用这两个命令编译 react 文件：

npx browserify \
-t [ babelify --presets [ @babel/preset-react @babel/preset-env ] ] \
./input.jsx -o ./temp1.js

然后：

npx babel ./temp1.js \
--presets=@babel/preset-react,@babel/preset-env,minify \
--no-comments --out-file ./output.js

我的 input.jsx 文件如下所示：

import react from 'react';
import Testing from './component/testing.jsx'
import reactDOM from 'react-dom';

reactDOM.render
(
    <Testing></Testing>,
    document.getElementById('root')
);

./component/testing.jsx 看起来像这样：

import React from 'react';

class Testing extends React.Component
{
    render()
    {
        return (
            <h1>Hello World</h1>
        );
    }
}

export default Testing;

package.json / 版本：

{
"dependencies": {
    "react": "^16.6.3",
    "react-dom": "^16.6.3"
},
"devDependencies": {
    "@babel/cli": "^7.2.0",
    "@babel/core": "^7.2.0",
    "@babel/preset-env": "^7.2.0",
    "@babel/preset-react": "^7.0.0",
    "babel-preset-minify": "^0.5.0",
    "babel-preset-react": "^6.24.1",
    "babelify": "^10.0.0",
    "browserify": "^16.2.3"
}
}

节点：v10.9.0
NPM：6.2.0

Answer 1

我认为您遇到了命名问题。在此导入语句 (input.jsx) 中：

import react from 'react';

将 react 更改为 React

Compiled react with browserify and babel says : ReferenceError: React is not defined

Compiled react with browserify and babel says : ReferenceError: React is not defined

javascript

browserify

reactjs

babeljs