草庐IT

javascript - 外部 react 组件看不到 React.Component

coder 2025-03-24 原文

当我链接为 npm 包时,外部 React 组件显示 Uncaught TypeError: Cannot read property 'Component' of undefined

我将 package.json 中的一个包链接为 "react-mapbox": "https://github.com/varya/react-mapbox.git"。然后我在代码中使用它

import {render} from 'react-dom';

import MapBox from "react-mapbox";

render(
  <div>
    <h1>Hello, world!</h1>
    <MapBox />
  </div>
  ,
  document.getElementById('example')
);

但没有任何效果,我得到了那个错误。完整的 repo 协议(protocol)在这里https://github.com/varya/react-mapbox-test我做了一个小例子来说明。

react-mapbox 包是我自己的,可能是我建错了?这是它的 repo https://github.com/varya/react-mapbox 我用 webpack 构建它,就像那样 https://github.com/varya/react-mapbox/blob/master/webpack.config.js正如我所想的那样,这个构建不包括 react 包,假设这将在链接它的项目中。但是组件仍然看不到 React 对象。

UPD

我按照@aulizko 的建议添加了 import React from 'react'; ,但这只在页面上提供了 React 对象。它对于组件仍然不可见。

要解决此问题,我必须提供此更改 https://github.com/varya/react-mapbox/commit/2687d66025aaa84553a79850aa8686e88f1f39d9 我还需要在组件代码中使用 react。 我必须用 Babel 来构建。出于某种原因,即使 react 是必需的,webpack 构建也会给出相同的错误。我创建了一个分支来说明这个 https://github.com/varya/react-mapbox/tree/webpack现在我对 Babel 很满意,但是有了这个分支,如果有兴趣,你可以看看 webpack 有什么问题。

最佳答案

您可能将您的模块捆绑为 UMD,这导致 bundle 使用消费者应用程序中不存在的全局 React 变量。您需要使用 https://webpack.github.io/docs/configuration.html#output-librarytarget 将包导出为 CommonJS 或 AMD 模块.简单地将 libraryTarget: 'commonjs2libraryTarget: 'amd' 添加到 webpack 配置中的 output 键并确保你正在导入 在您的组件中使用react

关于javascript - 外部 react 组件看不到 React.Component,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33147379/

有关javascript - 外部 react 组件看不到 React.Component的更多相关文章

  1. ruby-on-rails - rbenv:从 RVM 移动到 rbenv 后,在 Jenkins 执行 shell 中找不到命令 - 2

    我从Ubuntu服务器上的RVM转移到rbenv。当我使用RVM时,使用bundle没有问题。转移到rbenv后,我在Jenkins的执行shell中收到“找不到命令”错误。我内爆并删除了RVM,并从~/.bashrc'中删除了所有与RVM相关的行。使用后我仍然收到此错误:rvmimploderm~/.rvm-rfrm~/.rvmrcgeminstallbundlerecho'exportPATH="$HOME/.rbenv/bin:$PATH"'>>~/.bashrcecho'eval"$(rbenvinit-)"'>>~/.bashrc.~/.bashrcrbenvversions

  2. ruby-on-rails - 找不到 gem railties (>= 0.a) (Gem::GemNotFoundException) - 2

    我已经看到了一些其他的问题,尝试了他们的建议,但没有一个对我有用。我已经使用Rails大约一年了,刚刚开始一个新的Rails项目,突然遇到了问题。我卸载并尝试重新安装所有Ruby和Rails。Ruby很好,但Rails不行。当我输入railss时,我得到了can'tfindgemrailties。我当前的Ruby版本是ruby2.2.2p95(2015-04-13修订版50295)[x86_64-darwin15],尽管我一直在尝试通过rbenv设置ruby​​2.3.0。如果我尝试rails-v查看我正在运行的版本,我会得到同样的错误。我使用的是MacOSXElCapitan版本10

  3. ruby - 从外部访问类的实例变量 - 2

    我理解(我认为)Ruby中类变量和类的实例变量之间的区别。我想知道如何从该类外部访问该类的实例变量。从内部(即在类方法中而不是实例方法中),它可以直接访问,但是从外部,有没有办法做MyClass.class.[@$#]variablename?我没有任何具体原因要这样做,只是学习Ruby并想知道是否可行。 最佳答案 classMyClass@my_class_instance_var="foo"class上述yield:>>foo我相信Arkku演示了如何从类外部访问类变量(@@),而不是类实例变量(@)。我从这篇文章中提取了上述内

  4. 即使安装了 gem,Ruby 也找不到所需的库 - 2

    我花了几天时间尝试安装ruby​​1.9.2并让它与gems一起工作:-/我最终放弃了我的MacOSX10.6机器,下面是我的Ubuntu机器上的当前状态。任何建议将不胜感激!#rubytest.rb:29:in`require':nosuchfiletoload--mongo(LoadError)from:29:in`require'fromtest.rb:1:in`'#cattest.rbrequire'mongo'db=Mongo::Connection.new.db("mydb")#gemwhichmongo/usr/local/rvm/gems/ruby-1.9.2-p0/g

  5. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  6. ruby - Sinatra 找不到 View 目录 - 2

    我正在尝试以一种更类似于普通RubyGem结构的方式构建我的Sinatra应用程序。我有以下文件树:.├──app.rb├──config.ru├──Gemfile├──Gemfile.lock├──helpers│  ├──dbconfig.rb│  ├──functions.rb│  └──init.rb├──hidden│  └──Rakefile├──lib│  ├──admin.rb│  ├──api.rb│  ├──indexer.rb│  ├──init.rb│  └──magnet.rb├──models│  ├──init.rb│  ├──invite.rb│  ├─

  7. ruby - 在 SUSE 上找不到 Ruby 的头文件? - 2

    我正在尝试在SUSEEnterprise11SP3上安装compass。我得到以下信息。有什么想法吗?geminstallcompassBuildingnativeextensions.Thiscouldtakeawhile...ERROR:Errorinstallingcompass:ERROR:Failedtobuildgemnativeextension./usr/bin/rubyextconf.rbmkmf.rbcan'tfindheaderfilesforrubyat/usr/lib64/ruby/ruby.hextconffailed,exitcode1Gemfileswi

  8. ruby-on-rails - Heroku 找不到 SecureRandom - 2

    我的heroku应用崩溃了,因为它找不到模块“SecureRandom”。我在gemfile中指定了我的Ruby版本,我的计算机、gemfile和Heroku似乎都匹配Ruby版本号,尽管不是补丁号。其他帖子建议将usr/bin/heroku指向特定的Ruby文件,但我不确定该怎么做(我的应用程序中没有Herokubin)。这看起来像是Ruby版本错误。我该如何解决这个问题?classOrderItemHeroku日志:/app/vendor/bundle/ruby/2.0.0/gems/activesupport-4.0.3/lib/active_support/dependenci

  9. ruby - 无法安装 gem - make 未被识别为内部或外部命令可运行程序或批处理文件 - 2

    我想在Windows7上安装带有ruby​​1.9.3的rspec-railsgem。我收到一些错误消息,提示无法安装某些json库。所以,我使用下面的说明来解决它。来源=The'json'nativegemrequiresinstalledbuildtools从[rubyinstaller.org][3]下载[Ruby1.9.3][2]从[rubyinstaller.org][3]下载DevKit文件对于Ruby1.9.3,使用[DevKit-tdm-32-4.5.2-20110712-1620-sfx.exe][4]将DevKit解压到路径C:\Ruby193\DevKit运行cd

  10. ruby - 使用 Class.new 时访问外部范围 - 2

    是否有可能以某种方式访问​​Class.new范围内的a?a=5Class.new{defb;aend}.new.b#NameError:undefinedlocalvariableormethod`a'for#:0x007fa8b15e9af0>#:in`b' 最佳答案 即使@MarekLipka的回答是正确的——改变变量范围总是有风险的。这是可行的,因为每个block都带有创建它的上下文,因此您的局部变量a突然变得不那么局部了——它变成了一个“隐藏的”全局变量:a=5object=Class.new{define_method(

随机推荐