个人中心
文章发布
退出
作者热门文章
- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
25
4
我正在学习 React JS 的教程，一切都很好，几天来我可以运行一个示例，简单，执行推荐的基本配置，加上我添加的一些附加组件以识别 Javascript 版本.
经过几天不再审查项目，但它运行正常，执行命令时，我没有看到任何错误，但在浏览器中没有显示任何内容，仅在控制台中出现多个错误一个。
reac和react-dom卸载重装，问题依旧，尝试从 friend clone一个新项目，正常，只是复制了我的相同结构。
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
The above error occurred in one of your React components: Consider adding an error boundary to your tree to customize error handling behavior.
需要注意的是，bundle.js文件出现错误，该文件用于存放通过webpack生成的代码
{
"name": "prueba",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node server.js",
"dev": "concurrently \"node server.js\" \"webpack -w\" "
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.16.2",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"serve-static": "^1.13.1"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"concurrently": "^3.5.1",
"eslint": "^4.9.0",
"eslint-config-airbnb-base": "^12.1.0",
"eslint-plugin-import": "^2.7.0",
"webpack": "^3.10.0"
}
}
const path = require('path');
const config = {
entry: './src/index.jsx',
output: {
path: path.resolve('js'),
filename: 'bundle.js'
},
module: {
rules: [
{
test: /.jsx$/,
use:{
loader:'babel-loader'
},
exclude: /node_module/
}
]
}
}
module.exports = config;
import React, {Component} from 'react';
import {render} from 'react-dom';
class App extends Component{
render(){
return(
<div>
<h1>Mi Aplicacion React Js</h1>
<h3>Probando la exportacion</h3>
</div>
)
}
}
导出默认应用；
import React, { Component } from 'react';
import { render } from 'react-dom';
import {App} from './components/app.jsx';
render(
<App/>,
document.getElementById('appStart')
)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Aprendiendo React</title>
</head>
<body>
<div id="appStart"></div>
<script src="js/bundle.js"></script>
</body>
</html>
C:\Users\PterPmntaM\CursoReactJS\React_Scaffold> npm run dev
> prueba@1.0.0 dev C:\Users\PterPmntaM\CursoReactJS\React_Scaffold
> concurrently "node server.js" "webpack -w"
[0] Iniciando servidor
[1]
[1] Webpack is watching the files...
[1]
[1] Hash: 5fd2ce10b3c1788b385b
[1] Version: webpack 3.10.0
[1] Time: 4878ms
[1] Asset Size Chunks Chunk Names
[1] bundle.js 729 kB 0 [emitted] [big] main
[1] [14] ./src/index.jsx 381 bytes {0} [built]
[1] + 27 hidden modules
最佳答案
在 app.jsx 中，组件是这样导出的:
export default App;
但是它是这样导入的:
import {App} from './components/app.jsx';
代码失败是因为 app.jsx 中不存在 App 导出，并且出现了 undefined 作为错误提示。它被导出为 default 而不是。
这是正确的导入方式:
// The recommended way
import App from './components/app.jsx';
// The alternative way, to better illustrate what's going on
import { default as App } from './components/app.jsx';
这是对 ES 模块的一个很好的概述:http://exploringjs.com/es6/ch_modules.html
关于javascript - 警告 : React. createElement : type is invalid -- bundle. js，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48738761/
25
4
0
你好，我正在尝试在 opensuse 中创建一个 Shell 脚本来创建 MySqlUsers，但是当我尝试运行它时，我得到了这个错误: Warning: Could not start progra
我阅读了有关此错误的所有信息，但未能找到任何解决方案。 我有一个看起来像这样的简单页面: $xmlfile = "/var/www/marees.xml"; //Fichier dans lequel
运行 Websphere App 服务器 V8.5 Liberty Profile。我找不到任何可以解决这些警告的帮助。我在 eclipse 。 ************** He
我尝试在 GC AppEngine 上部署应用程序。部署过程中没有错误，但应用程序无法运行(仅显示加载页面)。日志中唯一一个奇怪的原始 OpenBLAS WARNING - could not det
我刚开始学习 RestKit。我正在尝试使用它来使用 Foursquare api 获取附近的 field 。但每次我尝试“objectLoader:(RKObjectLoader *)objectL
我对 Vuejs 比较陌生，每次按键时都会收到以下警告: [Vue warn]: $attrs is readonly. found in ---> at src\component
Warning: simplexml_load_file() [function.simplexml-load-file]: I/O warning : failed to load external
我在尝试修改某些表时不断收到此错误。这是我的代码: /** = 1){ //$this->mysqli->autocommit(FALSE); //insert th
当我尝试使用 PHP 的 ftp_put 函数上传文件时，早些时候出现错误: 警告:ftp_put() [function.ftp-put]:无数据连接 现在，我尝试开启被动模式: ftp_pasv(
我一直在努力让这段代码适用于现阶段的年龄。它旨在计算一个范围内的素数，我已经编写了一种方法来打印它们。不幸的是，代码将无法编译，引用警告: “警告:[未检查] 未检查调用 add(E) 作为原始类型
尝试使用带有架构组件和Kotlin的Android Studio 3 Canary 5构建示例会给出此警告。 谁能告诉我原因？ 谢谢，Ove 编辑＃1: 这是Dan Lew前段时间制作的样本 http
我正在编写一个 Shiny 的应用程序，它运行得非常好，突然我收到两条警告消息。我已经回到以前运行良好的副本，它们现在显示相同的错误消息，所以我真的很困惑。我的代码仍然运行并在我 Shiny 的仪表板
03-25 05:52:15.329 8029-8042/com.mgh.radio W/MediaPlayerNative: info/warning (703, 0) 03-25 05:52:15
我在构建时在我的 gradle 控制台中收到一条警告消息: 警告:[options] 引导类路径未与 -source 1.7 一起设置 1 条警告 我怎样才能解决这个问题？ 任何帮助表示赞赏! 最佳答
我有下一个代码: 测试.c #include "a1.h" int main() { int a = 8; foo(a); return a; } a1.h void foo
我的程序中有一个 WORD 变量。 WORD hour; 但是当我比较它的时候 if(hour>=0 && hour=0 && hour=0 的比较，它始终适用于 hour 是 WORD 类型，它是一
安全研究人员警告称，一个最新的严重的Java错误，其本质与目前在全球范围内利用的臭名昭著的 Log4Shell 漏洞相同 。 CVE-2021-42392 尚未在国家漏洞数据库 (NVD) 中
安装SqlServer2005时“版本变更检查 (警告)"问题排查 今天同事在安装SqlServer2005时遇到“版本变更检查 (警告) ”问题导致安装失败，警告提示如下： - 版本
我的 UWP 项目中出现以下警告。我已经标记了解决方案的示例，但我更感兴趣的是为什么在同一平台上创建另一个空项目时不会出现此警告？ APPX4001: Build property AppxBundl
我试图修复我的登录脚本，在我的本地主机上它可以工作，但上传到我的在线测试服务器时，注销被破坏，我得到这个错误: Warning: session_destroy() [function.session
我是一名优秀的程序员,十分优秀！