diff --git a/docz/docs/02-getting-started/01-installation/02-frameworks.md b/docz/docs/02-getting-started/01-installation/02-frameworks.md index ec6c3d1..d739e32 100644 --- a/docz/docs/02-getting-started/01-installation/02-frameworks.md +++ b/docz/docs/02-getting-started/01-installation/02-frameworks.md @@ -182,6 +182,41 @@ var read = XLSX.read, utils = XLSX.utils; The ["Bundlers" demo](/docs/demos/bundler) includes examples for specific tools. +### Dynamic Imports + +Dynamic imports with `import()` will only download scripts when they are needed. + +:::warning pass + +Dynamic `import` will always download the full contents of the imported scripts! + +**This is a design flaw in ECMAScript modules** + +::: + +It is strongly recommended to use a wrapper script that imports and re-exports +the parts of the SheetJS library that are used in a specific function or page: + +```js title="SheetJSWriteWrapper.js (wrapper script)" +/* This wrapper pulls `writeFileXLSX` and `utils` from the SheetJS library */ +import { utils, writeFileXLSX } from "xlsx"; +export { utils, writeFileXLSX }; +``` + +A dynamic import of the wrapper script will only load the requested features: + +```js +async function export_data() { + /* dynamically import the SheetJS Wrapper */ + // highlight-next-line + const XLSX = await import ("./SheetJSWriteWrapper"); + const wb = XLSX.utils.book_new(); + const ws = XLSX.utils.aoa_to_sheet([["a","b","c"],[1,2,3]]); + XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); + XLSX.writeFileXLSX(wb, "SheetJSDynamicWrapperTest.xlsx"); +} +``` + ## Encoding support If Encoding support is required, `cpexcel.full.mjs` must be manually imported: diff --git a/docz/docs/03-demos/01-frontend/07-angularjs.md b/docz/docs/03-demos/01-frontend/07-angularjs.md index 99047df..ecf94d3 100644 --- a/docz/docs/03-demos/01-frontend/07-angularjs.md +++ b/docz/docs/03-demos/01-frontend/07-angularjs.md @@ -35,8 +35,8 @@ input element for loading user-submitted files. ## Installation -The [Standalone scripts](/docs/getting-started/installation/standalone) can be -referenced in a `SCRIPT` tag from the HTML entrypoint page. +The [SheetJS Standalone scripts](/docs/getting-started/installation/standalone) +can be referenced in a `SCRIPT` tag from the HTML entry point page. The `$http` service can request binary data using `"arraybuffer"` response type. This maps to the `"array"` input format for `XLSX.read`: diff --git a/docz/docs/03-demos/01-frontend/08-bundler.md b/docz/docs/03-demos/01-frontend/08-bundler.md index f463ea4..98ff783 100644 --- a/docz/docs/03-demos/01-frontend/08-bundler.md +++ b/docz/docs/03-demos/01-frontend/08-bundler.md @@ -17,7 +17,7 @@ practices have evolved, stress testing SheetJS libraries have revealed bugs in the respective bundlers. This demo collects various notes and provides basic examples. -:::note +:::note pass Issues should be reported to the respective bundler projects. Typically it is considered a bundler bug if the tool cannot properly handle JS libraries. @@ -374,7 +374,7 @@ node esb.node.js -:::note +:::note pass Bundling raw data is supported using the `binary` loader. For more advanced content workflows, [ViteJS](/docs/demos/static/vitejs) is the recommended tool. @@ -482,11 +482,10 @@ click the "Click to Export!" button to generate a file. ## RequireJS -[Standalone scripts](/docs/getting-started/installation/standalone) comply with AMD `define` -semantics, enabling use in RequireJS out of the box. +The [SheetJS Standalone scripts](/docs/getting-started/installation/standalone) +comply with AMD `define` semantics. They support RequireJS out of the box. -To enable use of the alias `xlsx`, the RequireJS config should set an alias in -the `paths` property: +The RequireJS config should set the `xlsx` alias in the `paths` property: ```js require.config({ @@ -518,14 +517,18 @@ This demo was last tested on 2023 May 07 against RequireJS `2.3.3` ::: -:::caution +:::caution pass The `r.js` optimizer does not support ES6 syntax including arrow functions and the `async` keyword! The demo JS code uses traditional functions. ::: -0) Download the standalone build: +0) Download the SheetJS Standalone script and move to the project directory: + +