原生js使用es6引入import报错解决方法

2091 ℃

注意:在引入js的时候type值需设置为module

1、index.html代码

<!DOCTYPE html>
<html>
  <head>
     <meta charset="UTF-8">
     <title></title>
   </head>
   <body>
   </body>
   <script src="api.js" type="module"></script>
   <script src="util.js" type="module"></script>
   <script type="module">
	import { Obj, argu } from './util.js'
	var a = argu(10);
	var b = Obj.add(10);
	var c = Obj.reduce(10);
	console.log('index',a, b, c)
    </script>
</html>

2、util.js代码

export function argu(argu){
   return argu+10;
}

var Obj = {
    add:function(argu){
	return argu+10;
    },
   reduce:function(argu){
	return argu-1;
   }
}

export { Obj }

3、api.js代码

import { Obj, argu } from './util.js'

var a = argu(10);
var b = Obj.add(10);
var c = Obj.reduce(10);
console.log(a, b, c)

Ps:尚未得到支持的 import 路径符号

// 支持
import {foo} from 'https://jakearchibald.com/utils/bar.js';
import {foo} from '/utils/bar.js';
import {foo} from './bar.js';
import {foo} from '../bar.js';

// 不支持
import {foo} from 'bar.js';
import {foo} from 'utils/bar.js';

有效的路径符号应当符合以下条件规则之一:

完整的非相对路径。这样在将其传给new URL(moduleSpecifier)的时候才不会报错
以 / 开头。
以 ./ 开头。
以 …/ 开头。
其他形式的符号被保留下来,未来将用于其他功能(如引入[import]内置模块)。

原生js如何判断图片是否存在

原生JS如果只关闭手机浏览器中弹出提示框

原生JS如何生成一个表格(根据数据生成表格)

前端es6语法值的是哪些?(其中包含es10吗)

el-dialog中获取el-table组件的ref值报undefined错误!

标签: es6, import, 原生js, 报错

上面是“原生js使用es6引入import报错解决方法”的全面内容,想了解更多关于 js 内容,请继续关注web建站教程。

当前网址:https://m.ipkd.cn/webs_1991.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

HTTP协议中常见的请求头有哪些?各自的作用是什么?
帝国cms功能之网站管理系统操作日志管理帮助
解决dedecms图片附件二级域名无法显示
el-dialog弹窗全局垂直居中设置
wordpress函数如何查询友情链接详情(get_bookmark)