以下是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. 【转】python 调用super()初始化报错“TypeError: super() takes at least 1 argument”

    一.实验环境 1.Windows7x64_SP1 2.Anaconda2.5.0 + python2.7(anaconda集成,不需单独安装) 二.实验步骤 2.1 在python中有如下代码: cl ...

  2. QuantLib 金融计算——收益率曲线之构建曲线（3）

    目录 QuantLib 金融计算--收益率曲线之构建曲线(3) 概述 估算期限结构的步骤 读取样本券数据 一些基本配置 配置 *Helper 对象 配置期限结构 估算期限结构 汇总结果 当前实现存在的 ...

  3. ShellScript之变量

    Shell脚本之变量学习 ##########################ShellScript初学者,文章摘自菜鸟教程################################ 1.She ...

  4. 如何解决RIP的问题

    如何解决RIP的问题 RIP的问题  优化或解决的方式  收敛慢,故障恢复时间长  触发更新 缺少对全局网络拓扑的了解 路由器基于拓扑信息,独立计算路由 存在选择次优路径的风险 将链路带宽作为选路参考 ...

  5. Redux-saga-整理

    介绍 在redux中更好的解决异步操作 redux-saga相当于在redux原来的数据流中多了一层,对action进行监听 接收到action时,派发一个任务维护state saga通过Genera ...

  6. java如何消除太多的if else判断？

    1.简介 if判断语句是很多编程语言的重要组成部分.但是,若我们最终编写了大量嵌套的if语句,这将使得我们的代码更加复杂和难以维护. 让我们看看能否使用别的方式来做呢. 设计模式是为了更好的代码重用性 ...

  7. 关于IDEA中web项目中web.xml配置文件标红的解决办法

    原文链接 https://blog.csdn.net/qq_33451695/article/details/86684127 解决方法前提:web.xml没有实际错误,但依然被web.xml标红 出 ...

  8. Java常用类StringBuffer详解

    内容多为最近学习的自我总结,可能有些地方写的不严谨,甚至会有错误的地方,仅供参考,如发现错误敬请指出,谢谢! 灰色字体为补充扩展内容,多为帮助自己理解. StringBuffer概述: 线程安全的可变 ...

  9. 并发编程-线程，JMM，JVM，volatile

    1.线程 相信大家对线程这个名词已经很不陌生了,从刚开始学习java就接触到线程,先说说进程吧,进程就是系统分配资源的基本单位,线程是调度cpu的基本单位,进程由线程组成,一个进程至少又一个线程组成, ...

  10. HeadFirst设计模式(一)策略者模式

    最近在看HeadFirst设计模式一书,作为一个半路出家的程序员,感觉很多东西需要学习,学习的路程中有些东西学了当时觉得理解了,但日常工作中没有使用到渐渐的自己就忘记了.--------------- ...