es6 import

最近用reactjs写个h5 应用,封装一个model。然而使用这个model时候 总是报错:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.。。。

什么一开始还以为是style啥的 语法错误了,还真有! 然而 这个错误还是存在,stack overflow下 没啥结果。突然想到是不是import语法写错了? 去es6 官网看了下,貌似没啥错啊。。。。

郁闷

嗯?看到这个:

1 export function cube(x) {
2   return x * x * x;
3 }
4 const foo = Math.PI + Math.SQRT2;
5 export { cube, foo };

但我只export了一个class啊? 抱着试一试的心态。。。。。尼玛错误还真没了。

------------------------------------------------------

总结:如果import 不使用花括号的话,export时候得用default,否则 还是老老实实import {} 吧。

时间: 2024-10-27 01:14:57

es6 import的相关文章

ES6 import 引用文件夹/目录及其处理过程

1.现象 看redux的时候发现官网的教程里直接import了一个文件夹,我再三确定没有看错, 是一个 文件夹 (Directory), 它直接 import了一个目录!这个 文件夹/目录 底下还有一个index.js文件. js文件只能用index.js,换其他名字都会报错.我使用的是webpack + babel-loader来编译它的,也许是webpack或者是babel的某个设定而不是ES6 import本身的,总之这样是可以用的. 我也发现了这个问题,import是可以导入目录的,我看

关于ES6 import命令的一个补充

问题 今天查阅资料时发现,无论是阮一峰还是Mozilla网站有关ES6 import命令介绍部分都没有细致地提供这个命令后面可以跟一个文件路径的更多的细节. 其实,import命令一个典型的表达是其后面的from子句中可以直接跟一个路径(也常常跟一个省略.js扩展名的JS模块文件名). 此时,ES6在解析时会到指定路径下查找一个名字为index.js的文件.注意:js文件只能用index.js,换其他名字都会报错!!! 典型应用 有关import命令的上述情况的一个典型应用是,把此文件夹下其他.

Amd,Cmd, Commonjs, ES6 import/export的异同点

Amd,Cmd, Commonjs, ES6 import/export等均是模块化方案 1.Commonjs使用在Nodejs上,加载模块是同步的. 2.Amd是requirejs在推广过程中对模块定义的规范化产出,异步模块定义,requirejs是对这个概念的实现,好比JavaScript语言是对ECMAScript规范的实现. 3.Cmd是seajs在推广过程中对模块定义的规范化产出,是一个同步模块定义,seajs是cmd概念的一个实现,seajs是淘宝团队提供的一个模块开发的js框架.

es6 import 和node 的require

服务器端 node的module遵循CommonJS规范,浏览器端 requirejs遵循AMD,seajs遵循CMD 在node模块中,采用的是CommonJS规范,使用require引入模块,使用module.exports导出接口. ES6标准发布后,module成为标准,使用import引入模块,使用export指令导出接口, // a.js // -------- node ----------- module.exports = { a : function() {}, b : 'x

ES6 import and export

定义: 用来导入或者导出模块. ES6 的模块自动采用严格模式,不管你有没有在模块头部加上"use strict";. 严格模式主要有以下限制. 变量必须声明后再使用 函数的参数不能有同名属性,否则报错 不能使用with语句 不能对只读属性赋值,否则报错 不能使用前缀 0 表示八进制数,否则报错 不能删除不可删除的属性,否则报错 不能删除变量delete prop,会报错,只能删除属性delete global[prop] eval不会在它的外层作用域引入变量 eval和argumen

ES6 import export

export deault function() { }; import './a'; //表示直接执行a.js中的内容 import A from './a'; //不加{}表示a.js中使用的是export default import {A,B} from './a'; //a.js暴露了A和B import * as AA from './a';

writing a javascript module ready for ES6 import

javascript模块化是一个比较大也是比较容易混淆的topic.通常几乎所有的第三方Library都支持CMD,AMD,ES6,Global object方式来引用lib所暴露出来的服务. 那么如果我们希望自己写一个lib,并且作为模块能被其他模块自由引用应该怎么写呢? 首先,我们需要弄清楚我们应该如何export自己要写的模块的服务的方式有哪些? 总体来说,我们可以export一个namespace,一个函数,一个singleton,一个Function,一个object等.. 参考以下文

3分钟带你搞懂ES6 import 和 export

如下语句是 default import: // B.js import A from './A' 且只在A存在 default export 时生效: // A.js export default 42 这种情况下你用import语句, 随便取什么名字都没关系: // B.js import A from './A' import MyA from './A' import Something from './A' 因为他最终解析的是A.js 的 default export. 如下是命名为A

[ES6]import 与export的用法 ,export 与export default 的 区别 以及用法

一.import 与export export(导出):用于对外输出本模块(一个文件可以理解为一个模块)变量的接口: import(导入):用于在一个模块中加载另一个含有export接口的模块. 1.一个a.js文件有如下代码: a.导出单个变量: export var name="李四"; b.导出多个变量: var name1="李四"; var name2="张三"; export { name1 ,name2 } c.导出函数: func