feat: support esm import

Author: kekee000

.gitignore

@@ -17,7 +17,7 @@ node
 .vscode
 woff2/woff2
 woff2src/woff2*
-lib
+/lib
 baiduHealth-deflate.woff
 package-lock.json
 test/example/output

ESM_USAGE.md

@@ -21,19 +21,19 @@ The updated library supports both CommonJS and ESM module formats. In modern bun
 import fonteditorCore from 'fonteditor-core';
 
 // Or import specific modules
-import { Font, woff2 } from 'fonteditor-core';
+import { createFont, woff2 } from 'fonteditor-core';
 ```
 
 ## TypeScript Support
 
 The library includes TypeScript declarations. You can use it in TypeScript projects without any additional setup:
 
 ```typescript
-import fonteditorCore, { Font, woff2 } from 'fonteditor-core';
+import fonteditorCore, { createFont, woff2 } from 'fonteditor-core';
 import { Buffer } from 'buffer'; // If needed in browser environments
 
 // Using Font with type safety
-const font = Font.create(buffer, {
+const font = createFont(buffer, {
   type: 'ttf',
   hinting: true,
   subset: [65, 66, 67], // A, B, C
@@ -46,7 +46,7 @@ console.log(fontObject.head.xMin);
 // Using woff2 with type safety
 async function convertFont(ttfBuffer: ArrayBuffer) {
   await woff2.init('/woff2.wasm');
-  
+
   if (woff2.isInited()) {
     const woff2Buffer = fonteditorCore.ttftowoff2(ttfBuffer);
     return woff2Buffer;
@@ -78,15 +78,15 @@ import { woff2 } from 'fonteditor-core';
 
 function FontComponent() {
   const [isWoff2Ready, setIsWoff2Ready] = useState(false);
-  
+
   useEffect(() => {
     // Initialize woff2 module
     woff2.init('/woff2.wasm')
       .then(() => {
         setIsWoff2Ready(true);
       });
   }, []);
-  
+
   // Component logic...
 }
 ```
@@ -100,14 +100,14 @@ import { woff2 } from 'fonteditor-core';
 export default {
   setup() {
     const isWoff2Ready = ref(false);
-    
+
     onMounted(() => {
       woff2.init('/woff2.wasm')
         .then(() => {
           isWoff2Ready.value = true;
         });
     });
-    
+
     // Component logic...
   }
 }
@@ -126,7 +126,7 @@ To prevent SSR issues:
 
 ```javascript
 // Use the 'use client' directive in Next.js App Router
-'use client'; 
+'use client';
 
 import { useEffect } from 'react';
 import { Font } from 'fonteditor-core';
@@ -229,4 +229,4 @@ If you encounter issues with the library in modern bundlers:
 1. Make sure you're using the latest version of fonteditor-core
 2. Check that the WASM file is properly accessible in your public assets
 3. For Node.js environments, ensure you're using a version that supports ESM
-4. In case of bundling issues, try adding fonteditor-core to your bundler's transpilation list 
+4. In case of bundling issues, try adding fonteditor-core to your bundler's transpilation list

README.md

@@ -26,14 +26,14 @@ Read and write sfnt font like ttf, woff, woff2, eot, svg, otf.
 
 ```javascript
 // read font file
-import {Font} from 'fonteditor-core';
+import {createFont} from 'fonteditor-core';
 import fs from 'fs';
 
 const buffer = fs.readFileSync('font.ttf');
 // read font data, support format:
 // - for ttf, otf, woff, woff2, support ArrayBuffer, Buffer
 // - for svg, support string or Document(parsed svg)
-const font = Font.create(buffer, {
+const font = createFont(buffer, {
     // support ttf, woff, woff2, eot, otf, svg
     type: 'ttf',
     // only read `a`, `b` glyphs
@@ -126,20 +126,22 @@ This library supports both CommonJS and ES Modules. For detailed information on
 
 ```javascript
 // ESM import
-import fonteditorCore, { Font, woff2 } from 'fonteditor-core';
+import fonteditorCore, { createFont, woff2 } from 'fonteditor-core';
+
+createFont(buffer, options);
 ```
 
 ### woff2
 
 **Notice:** woff2 use wasm build of google woff2, before read and write `woff2`, we should first call `woff2.init()`.
 
 ```javascript
-import {Font, woff2} from 'fonteditor-core';
+import {createFont, woff2} from 'fonteditor-core';
 
 // in nodejs
 woff2.init().then(() => {
     // read woff2
-    const font =  Font.create(buffer, {
+    const font =  createFont(buffer, {
       type: 'woff2'
     });
     // write woff2
@@ -149,7 +151,7 @@ woff2.init().then(() => {
 // in browser
 woff2.init('/assets/woff2.wasm').then(() => {
     // read woff2
-    const font = Font.createEmpty();
+    const font = createFont();
     // write woff2
     const arrayBuffer = font.write({type: 'woff2'});
 });

index.d.ts

@@ -352,6 +352,12 @@ export namespace FontEditor {
      */
     static toBase64(buffer: FontInput): string;
 
+    /**
+     * font data
+     * @deprecated use font.get() instead
+     */
+    data: TTF.TTFObject;
+
     /**
      * read empty ttf object
      */
@@ -466,6 +472,17 @@ export namespace FontEditor {
      * Font class
      */
     Font: typeof Font;
+
+    /**
+     * create font object with font data
+     *
+     * @param buffer font data, support format
+     * - for ttf, otf, woff, woff2, support ArrayBuffer, Buffer
+     * - for svg, support string or Document(parsed svg)
+     * @param options font read options
+     */
+    createFont(buffer: FontInput, options: FontReadOptions): Font;
+
     /**
      * woff2 module
      */
@@ -619,6 +636,7 @@ export namespace FontEditor {
 // Named exports
 export const Font: typeof FontEditor.Font;
 export const woff2: FontEditor.Woff2;
+export const createFont: FontEditor.Core["createFont"];
 
 // Default export
 declare const fonteditorCore: FontEditor.Core;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fonteditor-core",
-  "version": "2.4.1",
+  "version": "2.5.0",
   "description": "fonts (ttf, woff, woff2, eot, svg, otf) parse, write, transform, glyph adjust.",
   "keywords": [
     "sfnt",
@@ -40,12 +40,13 @@
   "scripts": {
     "precommit": "npm run lint",
     "publish:npm": "npm run build && npm publish --registry=https://registry.npmjs.org/",
-    "test": "npm run test:browser && npm run test:node",
+    "test": "npm run test:browser && npm run test:node && npm run test:esm",
     "test:browser": "mocha --require @babel/register  test/spec/*.spec.js test/spec/**/*.spec.js",
     "test:node": "npm run build && mocha test/node-spec/**/*.spec.js ",
+    "test:esm": "cd test/esm && npm i &&  mocha --extension mjs index.mjs",
     "test:example": "cd test/example && npm i && npm run test",
     "dev": "webpack-dev-server --open --config ./config/webpack.dev.js",
-    "build": "babel src --out-dir lib && cp src/main.mjs lib/",
+    "build": "babel src --out-dir lib",
     "lint": "eslint ./src ./test",
     "lint:fix": "eslint --fix ./src ./test"
   },
@@ -70,11 +71,11 @@
     "woff2"
   ],
   "main": "./lib/main.js",
-  "module": "./lib/main.mjs",
+  "module": "./lib/main.esm.js",
   "types": "./index.d.ts",
   "exports": {
     ".": {
-      "import": "./lib/main.mjs",
+      "import": "./lib/main.esm.js",
       "require": "./lib/main.js",
       "types": "./index.d.ts",
       "default": "./lib/main.js"
@@ -95,7 +96,7 @@
     "html-webpack-plugin": "^3.2.0",
     "husky": "^4.3.0",
     "lint-staged": "^10.4.0",
-    "mocha": "^6.2.1",
+    "mocha": "^11.7.1",
     "pako": "^1.0.10",
     "style-loader": "^1.0.0",
     "webpack": "^4.41.1",

src/main.esm.js

@@ -0,0 +1,56 @@
+/**
+ * @file 主函数
+ * @author mengke01(kekee000@gmail.com)
+ */
+
+import {Font, createFont} from './ttf/font';
+import TTF from './ttf/ttf';
+import TTFReader from './ttf/ttfreader';
+import TTFWriter from './ttf/ttfwriter';
+import ttf2eot from './ttf/ttf2eot';
+import eot2ttf from './ttf/eot2ttf';
+import ttf2woff from './ttf/ttf2woff';
+import woff2ttf from './ttf/woff2ttf';
+import ttf2svg from './ttf/ttf2svg';
+import svg2ttfobject from './ttf/svg2ttfobject';
+import Reader from './ttf/reader';
+import Writer from './ttf/writer';
+import OTFReader from './ttf/otfreader';
+import otf2ttfobject from './ttf/otf2ttfobject';
+import ttf2base64 from './ttf/ttf2base64';
+import ttf2icon from './ttf/ttf2icon';
+import ttftowoff2 from './ttf/ttftowoff2';
+import woff2tottf from './ttf/woff2tottf';
+import woff2 from '../woff2/index';
+import bufferUtil from './nodejs/buffer';
+
+const modules = {
+    createFont,
+    Font,
+    TTF,
+    TTFReader,
+    TTFWriter,
+    ttf2eot,
+    eot2ttf,
+    ttf2woff,
+    woff2ttf,
+    ttf2svg,
+    svg2ttfobject,
+    Reader,
+    Writer,
+    OTFReader,
+    otf2ttfobject,
+    ttf2base64,
+    ttf2icon,
+    ttftowoff2,
+    woff2tottf,
+    woff2,
+    toArrayBuffer: bufferUtil.toArrayBuffer,
+    toBuffer: bufferUtil.toBuffer,
+};
+
+// Export named exports for ESM
+export {Font, woff2, createFont};
+
+// Export default object
+export default modules;

src/main.js

@@ -3,7 +3,7 @@
  * @author mengke01(kekee000@gmail.com)
  */
 
-import { Font } from './ttf/font';
+import {Font, createFont} from './ttf/font';
 import TTF from './ttf/ttf';
 import TTFReader from './ttf/ttfreader';
 import TTFWriter from './ttf/ttfwriter';
@@ -24,7 +24,8 @@ import woff2tottf from './ttf/woff2tottf';
 import woff2 from '../woff2/index';
 import bufferUtil from './nodejs/buffer';
 
-const modules = {
+module.exports = {
+    createFont,
     Font,
     TTF,
     TTFReader,
@@ -47,14 +48,3 @@ const modules = {
     toArrayBuffer: bufferUtil.toArrayBuffer,
     toBuffer: bufferUtil.toBuffer,
 };
-
-// Export named exports for ESM
-export { Font, woff2 };
-
-// Export default object
-export default modules;
-
-if (typeof exports !== 'undefined') {
-    // eslint-disable-next-line import/no-commonjs
-    module.exports = modules;
-}

src/main.mjs

@@ -345,7 +345,10 @@ Font.toBase64 = function (buffer) {
     return bytes2base64(buffer);
 };
 
-// 기존 방식: export default Font
-// 새로운 방식: 직접 export
-export { Font };
-export default Font;
+function createFont(buffer, options) {
+    return new Font(buffer, options);
+}
+
+export {Font, createFont};
+
+export default Font;