首页 > 解决方案 > 为什么“从'react'导入{React};” 不行?

问题描述

谁能向我解释为什么

import { React } from 'react';

打破一切,然而

import React from 'react';

工作得好吗?他们不是在说同样的话吗?我试图在文档和互联网上的其他地方找到答案,但我无法弄清楚。我认为这可能与Babel有关?

如果有帮助,这是我的 npm 包:

"dependencies": {
    "moment": "^2.18.1",
    "prop-types": "^15.5.10",
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "react-router-dom": "^4.0.0",
    "styled-jsx": "^3.2.1",
    "uuid": "^3.2.1"
  },
  "devDependencies": {
    "babel-core": "^6.24.1",
    "babel-loader": "^7.0.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "eslint": "^4.13.1",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-react": "^7.5.1",
    "file-loader": "^1.1.6",
    "html-webpack-plugin": "^2.29.0",
    "react-hot-loader": "^3.0.0-beta.7",
    "url-loader": "^0.6.2",
    "webpack": "^3.4.0",
    "webpack-dev-server": "^2.5.0"
}

标签: reactjsbabeljs

解决方案


import React from 'react'

这实质上是说“从模块中找到默认导出react并将其作为我想要调用的常量导入React。”

import { React } from 'react'

react这表示“从明确命名的模块中找到导出React,并将其作为我要调用的常量导入此处React。”

为什么不起作用import { React } from 'react'

因为包中没有指定的React导出react只有一个默认导出。如果你这样做,你会发现Reactundefined.

但它甚至不像我React在我的代码中使用的那样。所以,我就不能随便给它起个名字吗,比如import Foobar from 'react'

不,对不起。您需要导入默认值并为其命名React。这是因为无论何时您编写类似<MyComponent />or<App />的 JSX 代码,此 JSX 代码都会被转译并使用React.createElement(). 因此,您需要有权访问React.


有用的参考资料:


推荐阅读