import script module

.mjs



<script type="module">

  import {addTextToBody} from './utils.mjs';

  addTextToBody('Modules are pretty cool.');

</script>




// utils.mjs

export function addTextToBody(text) {

  const div = document.createElement('div');

  div.textContent = text;

  document.body.appendChild(div);

}

https://jakearchibald.com/2017/es-modules-in-browsers/

demos

mjs



<!DOCTYPE html>

<html lang="zh-Hans">

<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">

    <meta name="author" content="xgqfrms">

    <meta name="generator" content="VS code">

    <title>geoJSON to SVG</title>

</head>

<body>

    <svg data-uuid="live_map_svg" id="live_map_svg" width="100%" height="100%" viewBox="0 0 1000 600" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

    </svg>

    <!-- js -->

    <script type="module" src="./index.js"></script>

    <script type="module">

      import test from './test.js';

      test();

    </script>

    <!-- <script type="module">

      import {convert} from './convert.mjs';

      convert('Modules are pretty cool.');

    </script>

    <script type="module">

      import test from './test.js';

      test();

    </script> -->

</body>

</html>




// geoJSON

const log = console.log;

// import areas from "./geo-area-json.json";

import {convert} from './convert.mjs';

convert('Modules are pretty cool.');

// log(`log`, areas)

log(`log`)

refs

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules

https://www.sitepoint.com/using-es-modules/

https://javascript.info/modules-intro

https://stackoverflow.com/questions/44590393/es6-modules-undefined-onclick-function-after-import

https://stackoverflow.com/questions/49338193/how-to-use-code-from-script-with-type-module

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

import script module的更多相关文章

  1. ou can mix require and export. You can't mix import and module.exports.

    ou can mix require and export. You can't mix import and module.exports.

  2. 在eclipse中用java调用python报错 Exception in thread "main" ImportError: Cannot import site module and its dependencies

    最近做项目需要用java调用python,配置了jython后,运行了例子代码: 获得一个元组里面的元素: import org.python.util.PythonInterpreter; publ ...

  3. [Angular 2] Import custom module

    The application structure: in app.module.ts: import { NgModule} from "@angular/core"; impo ...

  4. solution for python can not import local module

    blog 这次遇到的问题是sys.path的输出不包含'',导致无法import当前文件和文件夹 When no ._pth file is found, this is how sys.path i ...

  5. virtualenvwrapper.sh: There was a problem running the initialization hooks. If Python could not import the module virtualenvwrapper.hook_loader, check that virtualenvwrapper.........（解决办法）

    Linux(ubuntu)上python2与python3共存环境下,安装virtualenvwrapper后, 其环境变量被自动设置为VIRTUALENVWRAPPER_PYTHON=/usr/bi ...

  6. import 本地Python module或package

    很基础很重要的一课,虽然很简单,但是防止以后忘了,还是记下来 这个笔记里说的都是import本地的,自己创建的,或者复制粘贴的别人的,总之“不是安装到library”的module or packag ...

  7. python中from module import * 的一个陷阱

    from module import *把module中的成员全部导到了当前的global namespace,访问起来就比较方便了.当然,python style一般不建议这么做,因为可能引起nam ...

  8. Python: import vs from （module) import function(class) 的理解

    Python: Import vs From (module) import function(class) 本文涉及的 Python 基本概念: Module Class import from . ...

  9. 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

随机推荐

  1. fastjson的deserializer的主要优化算法 漏洞

    JSON最佳实践 | kimmking's blog http://kimmking.github.io/2017/06/06/json-best-practice/ Fastjson内幕 Java综 ...

  2. 【rz】【sz】参数详解

    参数 SYNOPSIS sz [-+8abdefkLlNnopqTtuvyY] file ... b:以二进制方式,默认为文本方式 e:对所有控制字符转义 待续 常见问题: 1.xshell 使用rz ...

  3. 【Coredump】调试之旅

    测试反馈,core了. 拿到环境,发现6和11,一个是重复释放,一个是非法指针. 用GDB一挂 ,发现 1 GNU gdb (GDB) 7.5 2 Copyright (C) 2012 Free So ...

  4. 自己动手实现java断点/单步调试（一）

    又是好长时间没有写博客了,今天我们就来谈一下java程序的断点调试.写这篇主题的主要原因是身边的公司或者个人都执着于做apaas平台,简单来说apaas平台就是一个零代码或者低代码的配置平台,通过配置 ...

  5. Java关键字及作用解释

    访问控制 1) private 私有的 private 关键字是访问控制修饰符,可以应用于类.方法或字段(在类中声明的变量). 只能在声明 private(内部)类.方法或字段的类中引用这些类.方法或 ...

  6. Python3 注释、运算符、数字、字符串

    文章目录 注释 单引号(''') 双引号(""") 运算符 数字(Number) Python 数字类型转换 数学函数 随机数函数 三角函数 数学常量 数字与字符,列表之 ...

  7. log工具类

    package com.pt.platform.core.common; import java.text.SimpleDateFormat; import java.util.Date; impor ...

  8. java开发工具一个很好的注释模板

    <?xml version="1.0" encoding="UTF-8" standalone="no"?><templa ...

  9. P1268 树的重量（板子）

    题目: 题目描述 树可以用来表示物种之间的进化关系.一棵"进化树"是一个带边权的树,其叶节点表示一个物种,两个叶节点之间的距离表示两个物种的差异.现在,一个重要的问题是,根据物种之 ...

  10. 洛谷-P1439 【模板】最长公共子序列 (DP,离散化)

    题意:给两个长度为\(n\)的全排列,求他们的LCS 题解:这题给的数据范围到\(10^5\),用\(O(n^2)\)的LCS模板过不了,但由于给的是两个全排列,他们所含的元素都是一样的,所以,我们以 ...