反应/ Babelify新手; 如何解决“访问PropTypes”警告

我对React和Babelify都是新手。

我正在使用Node来编译一个Web应用程序。 现在我正在这样做:

browserify({debug: true}) .transform( babelify.configure({ comments : false, presets : [ "react", "babili", ], }) ) .require('./app.js', {entry: true}) .plugin(collapse) .bundle() .on("error", function (err) { console.log("Error:", err.message); }) .pipe(fs.createWriteStream(destination)); 

我的应用程序是一个非常琐碎的“你好,世界!” 关于这个复杂的概念:

 class Renderer { render () { ReactDOM.render( <div>Hello, World!</div> document.querySelector("#react-app") ); } } module.exports = Renderer; 

我得到这个警告:

 Warning: Accessing PropTypes via the main React package is deprecated, and will be removed in React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https:/gfb.me/prop-types-docs Warning: Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https:/gfb.me/react-create-class Error: [BABEL] /home/gweb/code/app.js: Unknown option: /home/gweb/code/node_modules/react/react.js.Children. Check out http:/gbabeljs.io/docs/usage/options/ for more information about options. A common cause of this error is the presence of a configuration options object without the corresponding preset name. Example: Invalid: `{ presets: [{option: value}] }` Valid: `{ presets: [['presetName', {option: value}]] }` For more detailed information on preset configuration, please see http:/gbabeljs.io/docs/plugins/#pluginpresets-options. (While processing preset: "/home/gweb/code/node_modules/react/react.js") while parsing file: /home/gweb/code/app.js 

我读了推荐的东西,但是我已经足够新了,我不能很好地处理它。 我还读了一些其他文章和SOpost,但没有一个(我可以find)有这个集(浏览,b​​abelify,反应)。

我目前的目标只是为了支持React语法(就是我所知道的JSX)来支持它,所以我可以开始使用它并学习这两个库。 实现这个目标的最快方法是什么(我不一定需要最高效或最好的,我宁愿在这个阶段有最容易理解的咒语,所以我可以让事情透明,而我学习)。

这不是你的设置问题,但问题是与您的import声明,我假设你是从反应import反应和PropTypes

import React, { PropTypes } from 'react';

所以,使用反应库中的PropTypes已经被废弃了,正如在警告中提到的那样,你需要把PropTypes作为npm的独立库来安装,然后使用它。

npm install prop-types --save然后做,

import PropTypes from 'prop-types' ,更多信息https://www.npmjs.com/package/prop-types

这将解决你的第一个警告,也是第二个警告,你需要安装和使用https://www.npmjs.com/package/create-react-class

对于babel错误,请检查是否安装了所需的两个库。 https://www.npmjs.com/package/babel-preset-react,https://www.npmjs.com/package/babel-preset-babili

你有一个导入的表单import * as React from 'react'

如果是这样,尝试用import React from 'react'replace它。

*react导入一切,包括不推荐使用的导出,这就是触发警告的原因。

Interesting Posts