以下是html中使用es6模块化引入的方法

一、html中的引入

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

</head>

<body>

    <div>1212</div>

    <script type="module">

        import {add as newadd} from './b.js'

        let res = newadd(2,3)

        console.log(res)

    </script>

</body>

</html>

注意：要加上 type="module"  ！！！并且配置好本地服务器访问html 。

如果是npm 下载后的包（node_modules），则貌似无法直接通过import ‘引入’ ，需要webpack的配置？？

二、js文件中的写法：

function add(a, b) {

    return a + b + 2;

}

export { add };

注意：建议js的导出利用export 的导出，而非export default 的导出！

非vue等框架中html 中使用es6的模块用法小结的更多相关文章

  1. javascript中break，continue和return语句用法小结：

    Break语句会使程序立刻退出包含在最底层的循环或者退出一个switch语句,它是用来退出循环或者switch语句. 例如: <script type="text/javascript ...

  2. Vue在ASP.NET MVC中的进行前后端的交互

    Vue在ASP.NET MVC中的进行前后端的交互 Preface: 由于最近在研究前端相关的技术,作为前端非常优秀的框架Vue,个人在学习的过程中遇到一些问题,网上相关资料有限,所以在这这里总结一下 ...

  3. vue及Eelement使用过程中遇到的一些问题

    在做项目的过程中,目前主要遇到了以下几个问题: 一.样式问题 1.样式中使用scoped的问题: 主要表现在从一个页面跳到另一个页面时,第二个页面的样式不能正确显示,通过刷新才能恢复页面的预定样式. ...

  4. vue 中一些API 或属性的常见用法

    prop 官方解释:Prop 是你可以在组件上注册的一些自定义特性.当一个值传递给一个 prop 特性的时候,它就变成了那个组件实例的一个属性. 通俗点讲就是:prop是父组件用来传递数据的一个自定义 ...

  5. WPF Step By Step 系列-Prism框架在项目中使用

    WPF Step By Step 系列-Prism框架在项目中使用 回顾 上一篇,我们介绍了关于控件模板的用法,本节我们将继续说明WPF更加实用的内容,在大型的项目中如何使用Prism框架,并给予Pr ...

  6. MEF框架在Silverlight中应用（15）

    原文:MEF框架在Silverlight中应用(15) MEF框架在Silverlight中应用 代码下载 MEF框架是微软提供的一个插件框架.应用概括为一句话:输入,输出,组合.下面是具体在Silv ...

  7. 给定一个只包含正整数的非空数组,返回该数组中重复次数最多的前N个数字 ,返回的结果按重复次数从多到少降序排列(N不存在取值非法的情况)

    """ #给定一个只包含正整数的非空数组,返回该数组中重复次数最多的前N个数字 #返回的结果按重复次数从多到少降序排列(N不存在取值非法的情况) 解题思路: 1.设定一个 ...

  8. CI框架在模型中切换读写库和读写库

    如果你想在控制器中切换在application/config/database.php中配置好的数据库group,那么你可以参考这篇博客:CI框架在控制器中切换读写库和读写库 如果你是希望在模型中切换 ...

  9. Yii框架中使用SRBAC作为权限管理模块时遇到的问题

    Yii框架中使用SRBAC作为权限管理模块时遇到的问题   看到Yii中提供RBAC的插件,SRBAC,就想用用. 结果按照手册上的安装办法,整来整去,安装完了,可就是进不了权限管理界面. 最后想到, ...

随机推荐

  1. 非替代品，MongoDB与MySQL对比分析

    IT168 评论]对于只有SQL背景的人来说,想要深入研究NoSQL似乎是一个艰巨的任务,MySQL与MongoDB都是开源常用数据库,但是MySQL是传统的关系型数据库,MongoDB则是非关系型数 ...

  2. SpringBoot第七篇：整合Mybatis-Plus

    作者:追梦1819 原文:https://www.cnblogs.com/yanfei1819/p/10881666.html 版权声明:本文为博主原创文章,转载请附上博文链接! 引言   一看这个名 ...

  3. Mysql 错误：Duplicate entry '0' for key 'PRIMARY'

    [1]添加数据报错:Duplicate entry '0' for key 'PRIMARY' (1)问题现象 SQL 语句如下: DROP TABLE test_distinct; CREATE T ...

  4. R数据挖掘 第一篇：聚类分析（划分）

    聚类是把一个数据集划分成多个子集的过程,每一个子集称作一个簇(Cluster),聚类使得簇内的对象具有很高的相似性,但与其他簇中的对象很不相似,由聚类分析产生的簇的集合称作一个聚类.在相同的数据集上, ...

  5. oracle日期格式和java日期格式区别 HH24:mm:ss和HH24:mi:ss的区别

    转载自:https://blog.csdn.net/yubin_yubin/article/details/18655553 在日期数据库数据查询出来的时候经常会to_char()一下,格式化一下日期 ...

  6. C# foreach循环

    一.简介 foreach循环可以迭代数组或者一个集合对象 二.语法 foreach(数据类型  变量名  in  数组名) {     //语句块: } 循环运行的过程:每一次循环时,从集合中取出一个 ...

  7. new/delete与malloc/free的区别

    new/delete与malloc/free的区别 参考: https://blog.csdn.net/u013485792/article/details/51329541 https://www. ...

  8. K8S CoreDNS部署失败，问题分析

    1. 查询k8s集群部署pod的基本情况 如下图,我们可知容器coredns和dnsutils都部署成功,但是由于域名解析的问题,导致coredns和dnsutils的容器不断重启(原因heath检查 ...

  9. [世预赛] 中国vs关岛，关岛实力有限 国足或许可以赢其10个球，比分预测 10:0，8:0，13:0

    [世预赛] 中国vs关岛 开赛时间:2019-10-10 20:00 继5比0大胜马尔代夫之后,国足迎来世预赛40强赛的第二场比赛,再次向世界杯发起冲击.10月10日,国足在广州迎战神秘之旅关岛. 1 ...

  10. loadrunner 基本操作

    1.录制(录制选项) 2.回放(运行时设置) 3.添加事物 4.参数化 5.内容检查 6.添加集合点 1.在脚本中添加集合点函数如下: lr_rendezvous("集合点") / ...