fix: fix umd export

guxin0123 · Dec 17, 2024 · a0acec6 · a0acec6
1 parent 68e0514
commit a0acec6
Show file tree

Hide file tree

Showing 5 changed files with 109 additions and 86 deletions.
diff --git a/docs/demo/index.html b/docs/demo/index.html
@@ -1,8 +1,8 @@
 <!DOCTYPE html>
-<html>
+<html lang="">
 
 <head>
-    <meta charset='utf-8' />
+    <meta charset='utf-8'/>
     <title>Shapefile in Leaflet!</title>
     <style>
         html {
@@ -18,24 +18,26 @@
         #map {
             height: 100%
         }
-        #upload{
+
+        #upload {
             position: absolute;
             z-index: 999;
             right: 100px;
             top: 20px;
         }
     </style>
-    <link rel="stylesheet" href="site/leaflet.css" />
+    <link rel="stylesheet" href="site/leaflet.css"/>
     <script src="site/leaflet.js"></script>
-    <script src="https://unpkg.com/[email protected]/lib/shp.umd.js"></script>
+    <script src="https://unpkg.com/shapefile-ts@latest/lib/shp.umd.js"></script>
+<!--    <script src="site/shp.umd.js"></script>-->
 
-    <script type="module" src="index.js"></script>
+     <script src="index.js"></script>
 
 </head>
 
 <body>
-    <button id="upload">upload</button>
-    <div id="map"></div>
+<button id="upload">upload</button>
+<div id="map"></div>
 
 
 </body>

diff --git a/docs/demo/index.js b/docs/demo/index.js
@@ -5,18 +5,39 @@
 // const shpHelper = new ShpHelper();
 // shpHelper.combine(shpHelper.parseShp(new Uint8Array(shpBuffer), /*optional prj str*/),shpHelper.parseDbf(new Uint8Array(dbfBuffer)));
 
-var m = L.map('map').setView([34.74161249883172, 18.6328125], 2);
-var geo = L.geoJson({ features: [] }, {
-  onEachFeature: function popUp(f, l) {
-    var out = [];
-    if (f.properties) {
-      for (var key in f.properties) {
-        out.push(key + ": " + f.properties[key]);
-      }
-      l.bindPopup(out.join("<br />"));
-    }
-  }
-}).addTo(m);
+let geo;
+
+function initMap() {
+    console.log('initMap');
+    console.log(document.querySelector("#map"));
+    const m = L.map('map').setView([34.74161249883172, 18.6328125], 2);
+    geo = L.geoJson({features: []}, {
+        onEachFeature: function popUp(f, l) {
+            var out = [];
+            if (f.properties) {
+                for (var key in f.properties) {
+                    out.push(key + ": " + f.properties[key]);
+                }
+                l.bindPopup(out.join("<br />"));
+            }
+        }
+    }).addTo(m);
+
+
+    document.getElementById("upload").addEventListener("click", () => {
+        PickUploadFileLegacy((file, name) => {
+            loadUploadFile(file, name);
+        }, ".zip");
+    })
+}
+
+
+async function loadData() {
+
+    const geoJsonData = await shp("site/TM_WORLD_BORDERS_SIMPL-0.3.zip");
+    addByGeoJsonData(geoJsonData, "codepage");
+}
+
 //var base =  'data/htmlprj?blah=baz';
 //var base =  'files/TM_WORLD_BORDERS_SIMPL-0.3.zip';
 // var base =  '/data/qgis.zip?aaa=bbb';
@@ -25,69 +46,70 @@ var geo = L.geoJson({ features: [] }, {
 //   //console.log(data)
 //   geo.addData(data);
 // });
-const geoJsonData = await shp("site/TM_WORLD_BORDERS_SIMPL-0.3.zip");
-addByGeoJsonData(geoJsonData, "codepage");
 
-//console.log(await shp( '/data/noshp.zip'))
 
+//console.log(await shp( '/data/noshp.zip'))
 
-document.getElementById("upload").addEventListener("click", () => {
-  PickUploadFileLegacy((file, name) => {
-    loadUploadFile(file, name);
-  }, ".zip");
 
-})
 const loadUploadFile = (file, path) => {
 
-  // const customNum = opts.customNum++;
-  const name = path.split("\\").pop();
-
-  const fileNameLower = name.toLowerCase();
-  const layerName = name.split(".")[0];
-  if (file && fileNameLower.endsWith(".zip")) {
-      //loadShpFile(file, layerName);
-      readUploadFile(file, async (result) => {
-          const geoJsonData = await shp(new Uint8Array(result),  "GB18030");
-          addByGeoJsonData(geoJsonData, layerName);
-      });
-      return;
-  }
-  alert("错误,不支持的文件格式!,关闭");
+    // const customNum = opts.customNum++;
+    const name = path.split("\\").pop();
+
+    const fileNameLower = name.toLowerCase();
+    const layerName = name.split(".")[0];
+    if (file && fileNameLower.endsWith(".zip")) {
+        //loadShpFile(file, layerName);
+        readUploadFile(file, async (result) => {
+            const geoJsonData = await shp(new Uint8Array(result), "GB18030");
+            addByGeoJsonData(geoJsonData, layerName);
+        });
+        return;
+    }
+    alert("错误,不支持的文件格式!,关闭");
 }
 
 const readUploadFile = (blobFile, onSuccess) => {
-  const fileReader = new FileReader();
-  fileReader.onload = async (e) => {
-      onSuccess(e.target.result);
-  }
-  fileReader.readAsArrayBuffer(blobFile);
+    const fileReader = new FileReader();
+    fileReader.onload = async (e) => {
+        onSuccess(e.target.result);
+    }
+    fileReader.readAsArrayBuffer(blobFile);
 }
-function addByGeoJsonData(a,b){
-  geo.addData(a);
-  console.log("layer added name :"+b)
+
+function addByGeoJsonData(a, b) {
+    geo.addData(a);
+    console.log("layer added name :" + b)
 }
+
 //传统上传方式
 function PickUploadFileLegacy(onChange, accept) {
-  const input = document.createElement("input");
-  input.type = "file";
-  // noinspection JSValidateTypes
-  input.style.display = "none";
-  //input.accept = ".zip,.csv";
-  if (accept) {
-    input.accept = accept;
-  }
-
-  input.onchange = function () {
-    if (onChange) {
-      const file = input.files[0];
-      const name = input.value;
-      input.remove();
-      onChange(file, name);
+    const input = document.createElement("input");
+    input.type = "file";
+    // noinspection JSValidateTypes
+    input.style.display = "none";
+    //input.accept = ".zip,.csv";
+    if (accept) {
+        input.accept = accept;
+    }
+
+    input.onchange = function () {
+        if (onChange) {
+            const file = input.files[0];
+            const name = input.value;
+            input.remove();
+            onChange(file, name);
+        }
     }
-  }
-  document.getElementsByTagName("body")[0].appendChild(input);
-  setTimeout(() => {
-    input.click();
-  }, 100);
+    document.getElementsByTagName("body")[0].appendChild(input);
+    setTimeout(() => {
+        input.click();
+    }, 100);
+
+}
 
+window.onload = function () {
+    initMap();
+    loadData();
+   // console.log(shp);
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "shapefile-ts",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/guxin0123/shapefile-ts.git"

diff --git a/rollup/rollup.umd.config.mjs b/rollup/rollup.umd.config.mjs
@@ -1,16 +1,17 @@
 //rollup.umd.config.mjs
-import { nodeResolve } from '@rollup/plugin-node-resolve';
+import {nodeResolve} from '@rollup/plugin-node-resolve';
 
 import basicConfig from './rollup.config.mjs'
 import terser from '@rollup/plugin-terser';
 import replace from '@rollup/plugin-replace'
 
 
-import { readFile } from 'fs/promises';
+import {readFile} from 'fs/promises';
+
 const pkg = JSON.parse(
-  await readFile(
-    new URL('../package.json', import.meta.url)
-  )
+    await readFile(
+        new URL('../package.json', import.meta.url)
+    )
 );
 
 const config = {
@@ -20,13 +21,13 @@ const config = {
             name: "shp",//浏览器引入的全局变量名称
             file: pkg.umd, //输出文件
             format: 'umd', //输出格式
-            exports: 'named', //导出的是全局变量命名方式
+            exports: 'default', //导出的是全局变量命名方式
             sourcemap: true,
-            //   globals: { //对被排除的依赖命名
-            //     'react': 'React', //三方库映射
-            //     'react-dom': 'ReactDOM',
-            //     'axios': 'Axios'
-            //   },
+            globals: { //对被排除的依赖命名
+                //     'react': 'React', //三方库映射
+                //     'react-dom': 'ReactDOM',
+                // 'shapeFile.default.shp': 'shp'
+            },
             plugins: [
                 terser({
                     compress: {

diff --git a/src/index.ts b/src/index.ts
@@ -1,7 +1,6 @@
-import {ShpHelper} from "@/shp-helper";
-import {ParseDbf} from "./parse-dbf";
-import {ParseShp} from "./parse-shp";
 import {ShpReader} from "@/shp-reader";
+import {ShpHelper} from "@/shp-helper";
+
 
 const shp = async function (base: string | Uint8Array, encoding?: string) {
     return await ShpReader.read(base, encoding);
@@ -10,4 +9,3 @@ shp.ShpHelper = ShpHelper;
 shp.ShpReader = ShpReader;
 
 export default shp;
-export {ShpHelper, ParseDbf, ParseShp}