diff --git a/leaflet/d1/index.html b/leaflet/d1/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..2b8208c02536f4e987c6e90507b7efa7ab3090ad
--- /dev/null
+++ b/leaflet/d1/index.html
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/leaflet/d1/index.js b/leaflet/d1/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..41ae5112e0d5ed270ba72889da95b646ce4348df
--- /dev/null
+++ b/leaflet/d1/index.js
@@ -0,0 +1,17 @@
+// Import stylesheets
+// import './style.css';
+import { Map, TileLayer } from '../lib/leaflet/leaflet-src.esm.js';
+
+// Write Javascript code!
+const map = new Map('map');
+
+const layer = new TileLayer(
+ 'http://wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=7',
+ {
+ subdomains: '1234'
+ }
+);
+
+layer.addTo(map);
+
+map.setView([39.909186, 116.397411], 10);
diff --git a/leaflet/d1/style.css b/leaflet/d1/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..b226f83ba77b35c5b8f562eefee45995f3844794
--- /dev/null
+++ b/leaflet/d1/style.css
@@ -0,0 +1,18 @@
+/* @import './leaflet/leaflet.css'; */
+
+html,
+body {
+ width: 100%;
+ height: 100%;
+ margin: 0px;
+}
+
+h1,
+h2 {
+ font-family: Lato;
+}
+
+#map {
+ width: 100%;
+ height: 100%;
+}
diff --git a/leaflet/lib/inline-module/index.js b/leaflet/lib/inline-module/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..c9666bbc10815351c0fd9aa46821f56e5372a925
--- /dev/null
+++ b/leaflet/lib/inline-module/index.js
@@ -0,0 +1,146 @@
+const loaderMap = window['inline-module-loaders'];
+
+const currentScript = document.currentScript || document.querySelector('script');
+
+// https://github.com/WICG/import-maps
+const map = {imports: {}, scopes: {}};
+const installed = new Set();
+
+function toBase64(str) {
+ return btoa(unescape(encodeURIComponent(str)));
+}
+
+function loadContent(url) {
+ const request = new XMLHttpRequest();
+ request.open('GET', url, false); // `false` makes the request synchronous
+ request.send(null);
+
+ if(request.status === 200) {
+ return request.responseText;
+ }
+ throw new Error(request.statusText);
+}
+
+// replace code
+function replaceImport(code, map) {
+ const importExp = /^(\s*import\s+[\s\S]*?from\s*['"`])([\s\S]*?)(['"`])/img;
+ return code.replace(importExp, (a, b, c, d) => {
+ const url = map[c];
+ if(url) {
+ return `${b}${url}${d}`;
+ }
+ return `${b}${c}${d}`;
+ });
+}
+
+function getBlobURL(module, replaceImportURL = false, map = {}) {
+ let jsCode = module.textContent;
+ if(module.hasAttribute('src')) {
+ const url = module.getAttribute('src');
+ jsCode = loadContent(url);
+ module.textContent = jsCode;
+ }
+ if(replaceImportURL) {
+ jsCode = replaceImport(jsCode, map);
+ }
+ let loaders = module.getAttribute('loader');
+ if(loaders) {
+ loaders = loaders.split(/\s*>\s*/);
+ jsCode = loaders.reduce((code, loader) => {
+ const {transform, imports} = loaderMap[loader];
+ const {code: resolved, map: sourceMap} = transform(code, {sourceMap: true, filename: module.getAttribute('name') || module.id || 'anonymous'});
+ if(sourceMap) code = `${resolved}\n\n//# sourceMappingURL=data:application/json;base64,${toBase64(JSON.stringify(sourceMap))}`;
+ else code = resolved;
+ Object.assign(map.imports, imports);
+ return code;
+ }, jsCode);
+ }
+ return createBlob(jsCode, 'text/javascript');
+}
+
+function createBlob(code, type = 'text/plain') {
+ const blob = new Blob([code], {type});
+ const blobURL = URL.createObjectURL(blob);
+ return blobURL;
+}
+
+function setup() {
+ const modules = document.querySelectorAll('script[type="inline-module"]');
+ const importMap = {};
+ const loadModules = [];
+
+ const importMapEl = document.querySelector('script[type="importmap"]');
+ if(importMapEl) {
+ console.warn('Cannot update importmap after