以下是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. 编译和安装openssl

    linux安装了Python3.7之后, pip不好用了,报错如下: pip is configured with locations that require TLS/SSL, however th ...

  2. ng 使用阿里巴巴矢量图

    1.进入阿里巴巴矢量图标库中,选择需要下载的图标,添加进项目中 2.进去项目选择Font class 模式,然后下载到本地 3.解压下载的压缩包,把.css/.svg/.ttf/.woff/.woff ...

  3. 如何解决aws解绑银行卡问题？

    首先先来说明一下我自己的情况? 一年的免费使用 前提:没有开启任何的实例服务 先贴一条官方的解释 关于我小白一个.学校课程要求使用aws,注册之后在网络上看到一堆人踩坑,aws的扣费就是个坑! 预授权 ...

  4. 奥展项目笔记02--一个bat文件运行多个java jar包

    奥展项目中后端微服务有很多jar包,一个一个启动又费时间效率又低,怎么才能一下让所有的jar包一块运行呢?我们可以编写.bat文件来一键启动. 1.我们将.bat文件放到jar包的同一级目录文件夹中: ...

  5. Python课程第六天作业

    1.以自己的理解总结为什么会出现循环导入,并用代码举例说明 循环导入报错并不是应为相互之间引用而导致报错,实际上是在导入一个模块时发现引用的模块不存在 示例如下: m1.py from m2 impo ...

  6. PHP小程序后端支付代码亲测可用

    小程序后端支付代码亲测可用 <?php namespace Home\Controller; use Think\Controller; class WechatpayController ex ...

  7. Natasha V1.3.6.0 的升级日志

    开源库满足于个人,而完善于大众. Natasha 自稳定版发布之后,众多老铁参与增强改进,感谢如下老铁的反馈: 1. 异常搜集 在 wenjq0911 建议下,添加了异常捕获,现 Natasha 的编 ...

  8. PIE SDK图像重采样算法

    1.算法功能简介 图像重采样是指对采样后形成的由离散数据组成的数字图像按所需的像元位置或像元问距重新采样,以构成几何变换后的新图像.重采样过程本质上是图像恢复过程,它用输入的离散数字图像重建代表原始图 ...

  9. Java I/O系统学习系列二：输入和输出

    编程语言的I/O类库中常使用流这个抽象概念,它代表任何有能力产出数据的数据源对象或者是有能力接收数据的接收端对象.“流”屏蔽了实际的I/O设备中处理数据的细节. 在这个系列的第一篇文章:<< ...

  10. Width Height -- (1)

    Width和Height应该是我们学习CSS时,最先接触到的属性了,一宽一高. 我们知道页面当中的标签分为块级元素和行内元素,它们最大的区别就在于,块级元素可以设置宽高,行内元素不能设置宽高. 举例说 ...