From 8c754069bfe32053dc569c3efc94c3db18c122ce Mon Sep 17 00:00:00 2001
From: SheetJS <dev@sheetjs.com>
Date: Sun, 7 May 2023 09:58:36 -0400
Subject: [PATCH] eleventy
---
.spelling | 6 +
.../01-installation/01-standalone.mdx | 45 ++---
.../01-installation/02-frameworks.md | 28 +--
.../01-installation/03-nodejs.md | 49 +++--
.../01-installation/04-amd.md | 2 +-
.../01-installation/05-extendscript.md | 2 +-
.../01-installation/06-deno.md | 17 +-
.../01-installation/07-bun.md | 6 +-
docz/docs/02-getting-started/02-example.mdx | 177 ++++++++++++------
docz/docs/03-demos/01-frontend/01-react.md | 13 +-
docz/docs/03-demos/01-frontend/02-vue.md | 13 +-
docz/docs/03-demos/01-frontend/03-angular.md | 17 +-
docz/docs/03-demos/01-frontend/04-svelte.md | 13 +-
docz/docs/03-demos/01-frontend/08-bundler.md | 154 +++++++--------
docz/docs/03-demos/04-static/02-gatsbyjs.md | 13 +-
docz/docs/03-demos/04-static/05-vitejs.md | 2 +-
docz/docs/03-demos/04-static/07-eleventy.md | 166 ++++++++++++++++
docz/docs/03-demos/04-static/11-svelte.md | 7 +-
.../04-static/{10-astro.md => 12-astro.md} | 5 +-
.../03-demos/05-mobile/02-nativescript.md | 5 +-
docz/docs/03-demos/05-mobile/03-quasar.md | 5 +-
docz/docs/03-demos/05-mobile/04-ionic.md | 8 +-
docz/docs/03-demos/05-mobile/05-capacitor.md | 5 +-
docz/docs/03-demos/06-desktop/01-electron.md | 2 +-
docz/docs/03-demos/06-desktop/02-nwjs.md | 2 +-
.../03-demos/06-desktop/06-reactnative.md | 9 +-
docz/docs/03-demos/06-desktop/09-cli.md | 15 +-
docz/docs/03-demos/07-data/09-alasql.md | 16 +-
docz/docs/03-demos/07-data/14-knex.md | 5 +-
docz/docs/03-demos/07-data/26-redis.md | 5 +-
docz/docs/03-demos/09-cloud/02-aws.md | 7 +-
docz/docs/03-demos/09-cloud/08-airtable.md | 5 +-
docz/docs/03-demos/09-cloud/index.md | 2 +-
.../03-demos/10-extensions/03-excelapi.md | 7 +-
docz/docs/03-demos/10-extensions/04-gsheet.md | 4 +-
docz/docs/03-demos/10-extensions/05-osa.md | 5 +-
.../03-demos/10-extensions/06-mathematica.md | 5 +-
docz/docs/03-demos/12-engines/01_duktape.md | 5 +-
docz/docs/03-demos/12-engines/02_jsc.md | 5 +-
docz/docs/03-demos/12-engines/03_rhino.md | 5 +-
docz/docs/03-demos/12-engines/04_nashorn.md | 5 +-
docz/docs/03-demos/12-engines/05_goja.md | 5 +-
docz/docs/03-demos/12-engines/07_chakra.md | 5 +-
docz/docs/03-demos/12-engines/08_quickjs.md | 9 +-
docz/docs/03-demos/12-engines/09_rb.md | 5 +-
docz/docs/03-demos/12-engines/11_perl.md | 5 +-
docz/docs/03-demos/index.md | 1 +
docz/docs/06-solutions/01-input.md | 40 ++--
docz/docs/06-solutions/05-output.md | 12 +-
docz/docs/08-api/07-write-options.md | 23 +--
docz/docs/09-miscellany/02-errors.md | 9 +-
docz/docs/09-miscellany/05-contributing.md | 2 +-
docz/docs/index.md | 9 +-
docz/docusaurus.config.js | 2 +-
docz/src/theme/prism-include-languages.js | 25 +++
docz/static/eleventy/_eleventy.js | 21 +++
docz/static/eleventy/index.njk | 10 +
57 files changed, 685 insertions(+), 365 deletions(-)
create mode 100644 docz/docs/03-demos/04-static/07-eleventy.md
rename docz/docs/03-demos/04-static/{10-astro.md => 12-astro.md} (98%)
create mode 100644 docz/src/theme/prism-include-languages.js
create mode 100644 docz/static/eleventy/_eleventy.js
create mode 100644 docz/static/eleventy/index.njk
diff --git a/.spelling b/.spelling
index 57fe27a..1882c3e 100644
--- a/.spelling
+++ b/.spelling
@@ -8,6 +8,7 @@ pagination_prev
pagination_next
TabItem
DocCardList
+CodeBlock
# frontmatter noise
api
@@ -158,8 +159,10 @@ ES5
ES6
ESM
ETH
+Eleventy
Endian
Ethercalc
+ExecJS
ExpressJS
ExtendScript
Fastify
@@ -168,6 +171,7 @@ FileReaderSync
FileSaver
GBK
GatsbyJS
+GitHub
GitLab
Goja
GraphQL
@@ -239,6 +243,7 @@ R9
RDBMS
README
RESTlets
+RSS
ReactJS
Redis
RequireJS
@@ -259,6 +264,7 @@ Snowpack
SuiteScript
SuiteScripts
Suitelets
+SvelteKit
SystemJS
Tauri
TensorFlow
diff --git a/docz/docs/02-getting-started/01-installation/01-standalone.mdx b/docz/docs/02-getting-started/01-installation/01-standalone.mdx
index 45e30ff..3195f50 100644
--- a/docz/docs/02-getting-started/01-installation/01-standalone.mdx
+++ b/docz/docs/02-getting-started/01-installation/01-standalone.mdx
@@ -7,17 +7,18 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
# Standalone Browser Scripts
Each standalone release script is available at <https://cdn.sheetjs.com/>.
-<div>The current version is {current} and can be referenced as follows:</div>
+<p>The current version is {current} and can be referenced as follows:</p>
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<!-- use version ${current} -->
<script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`}
-</code></pre>
+</CodeBlock>
:::info
@@ -43,10 +44,10 @@ They are known CDN bugs.
`xlsx.full.min.js` is the complete standalone script. It includes support for
reading and writing many spreadsheet formats.
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<!-- use xlsx.full.min.js from version ${current} -->
<script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`}
-</code></pre>
+</CodeBlock>
A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build:
@@ -59,10 +60,10 @@ A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build:
Replace references to `xlsx.full.min.js` with `xlsx.mini.min.js`. Starting from
scratch, a single script tag should be added at the top of the HTML page:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<!-- use xlsx.mini.min.js from version ${current} -->
<script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.mini.min.js"></script>`}
-</code></pre>
+</CodeBlock>
</details>
@@ -72,16 +73,16 @@ For broad compatibility with JavaScript engines, the library is written using
ECMAScript 3 language dialect. A "shim" script provides implementations of
functions for older browsers and environments.
-<div>Due to SSL compatibility issues, older versions of IE will not be able to
+Due to SSL compatibility issues, older versions of IE will not be able to
use the CDN scripts directly. They should be downloaded and saved to a public
directory in the site:
+
<ul>
<li>Standalone: <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.mini.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.mini.min.js</a></li>
<li>Shim: <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/shim.min.js</a></li>
</ul>
-</div>
-Add a `script` reference to the shim before the script tag that loads `xlsx.js`:
+Add a `script` reference to the shim before the standalone script:
```html
<!-- add the shim first -->
@@ -95,10 +96,10 @@ Add a `script` reference to the shim before the script tag that loads `xlsx.js`:
The standalone scripts can be loaded using `importScripts` at the top of the
worker scripts:
-<pre><code parentName="pre" {...{"className": "language-js"}}>{`\
+<CodeBlock language="js">{`\
importScripts("https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js");
importScripts("https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js");`}
-</code></pre>
+</CodeBlock>
## ECMAScript Module Imports
@@ -114,42 +115,42 @@ described [in the next section](/docs/getting-started/installation/frameworks).
The ECMAScript Module build is saved to `xlsx.mjs` and can be directly added to
a page with a `script` tag using `type="module"`:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script type="module">
import { read, writeFileXLSX } from "https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs";
</script>`}
-</code></pre>
+</CodeBlock>
If Encoding support is required, `cpexcel.full.mjs` must be manually imported:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script type="module">
/* load the codepage support library for extended support with older formats */
import { set_cptable } from "https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs";
import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
set_cptable(cptable);
</script>`}
-</code></pre>
+</CodeBlock>
Dynamic imports with `import()` can be used in data export scenarios. This
example will download the library only when the export button is pressed:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<button id="xport">Export</button>
<script type="module">
xport.addEventListener("click", async() => {
-
+\n\
/* dynamically import the library in the event listener */
// highlight-next-line
const XLSX = await import("https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs");
-
+\n\
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.writeFile(wb, "SheetJSESMTest.xlsx");
});
</script>`}
-</code></pre>
+</CodeBlock>
Web Worker support is noted in [the demo](/docs/demos/bigdata/worker#installation)
@@ -164,8 +165,8 @@ Bower is deprecated and the maintainers recommend using other tools.
The Bower package manager plays nice with the CDN tarballs:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npx bower install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
Bower will place the standalone scripts in `bower_components/js-xlsx/dist/`
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 fdd1437..3582658 100644
--- a/docz/docs/02-getting-started/01-installation/02-frameworks.md
+++ b/docz/docs/02-getting-started/01-installation/02-frameworks.md
@@ -18,21 +18,21 @@ Each standalone release package is available at <https://cdn.sheetjs.com/>. The
NodeJS package is designed to be used with frameworks and bundlers. It is a
proper ECMAScript Module release which can be optimized with developer tools.
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -64,24 +64,24 @@ This is a known registry bug
For existing projects, the easiest approach is to uninstall and reinstall:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm rm --save xlsx
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm rm xlsx
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn remove xlsx
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/02-getting-started/01-installation/03-nodejs.md b/docz/docs/02-getting-started/01-installation/03-nodejs.md
index bc86c32..389e081 100644
--- a/docz/docs/02-getting-started/01-installation/03-nodejs.md
+++ b/docz/docs/02-getting-started/01-installation/03-nodejs.md
@@ -16,28 +16,27 @@ import TabItem from '@theme/TabItem';
Tarballs are available on <https://cdn.sheetjs.com>.
-<div>Each individual version can be referenced using a similar URL pattern.<br/>
-<a href={`https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}>https://cdn.sheetjs.com/xlsx-{current}/xlsx-{current}.tgz</a> is the URL for {current}</div>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}>https://cdn.sheetjs.com/xlsx-{current}/xlsx-{current}.tgz</a> is the URL for version {current}</p>
## Installation
Tarballs can be directly installed using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -60,24 +59,24 @@ This is a known registry bug
For existing projects, the easiest approach is to uninstall and reinstall:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm rm --save xlsx
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm rm xlsx
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn remove xlsx
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -100,29 +99,29 @@ in `package.json` can control module resolution:
For general stability, "vendoring" modules is the recommended approach:
-<div>1) Download the tarball (<code parentName="pre">xlsx-{current}.tgz</code>) for the desired version. The current
- version is available at <a href={`https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}>https://cdn.sheetjs.com/xlsx-{current}/xlsx-{current}.tgz</a></div><br/>
+<p>1) Download the tarball (<code parentName="pre">xlsx-{current}.tgz</code>) for the desired version. The current
+ version is available at <a href={`https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}>https://cdn.sheetjs.com/xlsx-{current}/xlsx-{current}.tgz</a></p>
2) Create a `vendor` subfolder at the root of your project and move the tarball
to that folder. Add it to your project repository.
3) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save file:vendor/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install file:vendor/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add file:vendor/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/02-getting-started/01-installation/04-amd.md b/docz/docs/02-getting-started/01-installation/04-amd.md
index e714e09..5bc9d54 100644
--- a/docz/docs/02-getting-started/01-installation/04-amd.md
+++ b/docz/docs/02-getting-started/01-installation/04-amd.md
@@ -15,7 +15,7 @@ Each standalone release script is available at <https://cdn.sheetjs.com/>.
`xlsx.full.min.js` supports AMD with name `xlsx` out of the box.
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.full.min.js</a> is the URL for {current}</div><br/>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.full.min.js</a> is the URL for {current}</p>
:::note
diff --git a/docz/docs/02-getting-started/01-installation/05-extendscript.md b/docz/docs/02-getting-started/01-installation/05-extendscript.md
index 8d397b1..3ba5c49 100644
--- a/docz/docs/02-getting-started/01-installation/05-extendscript.md
+++ b/docz/docs/02-getting-started/01-installation/05-extendscript.md
@@ -14,7 +14,7 @@ Each standalone release script is available at <https://cdn.sheetjs.com/>.
`xlsx.extendscript.js` is an ExtendScript build for Photoshop and InDesign.
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.extendscript.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.extendscript.js</a> is the URL for {current}</div><br/>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.extendscript.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.extendscript.js</a> is the URL for {current}</p>
After downloading the script, it can be directly referenced with `#include`:
diff --git a/docz/docs/02-getting-started/01-installation/06-deno.md b/docz/docs/02-getting-started/01-installation/06-deno.md
index 2db7ea9..d9f68a7 100644
--- a/docz/docs/02-getting-started/01-installation/06-deno.md
+++ b/docz/docs/02-getting-started/01-installation/06-deno.md
@@ -9,6 +9,7 @@ sidebar_custom_props:
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
# Deno
@@ -16,10 +17,10 @@ Module scripts and type definitions are available at <https://cdn.sheetjs.com/>.
Using the URL imports, `deno run` will automatically download scripts and types:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';`}
-</code></pre>
+</CodeBlock>
The `@deno-types` comment instructs Deno to use the type definitions.
@@ -42,28 +43,28 @@ new versions are released!
If Encoding support is required, `cpexcel.full.mjs` must be manually imported:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
/* load the codepage support library for extended support with older formats */
import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
XLSX.set_cptable(cptable);`}
-</code></pre>
+</CodeBlock>
## Upgrade Notes
Upgrading to the latest version involves changing the import URLs. The import
and the types URLs should be updated at the same time:
-<pre><code parentName="pre" {...{"className": "language-diff"}}>{`\
+<CodeBlock language="diff">{`\
-// @deno-types="https://cdn.sheetjs.com/xlsx-0.18.3/package/types/index.d.ts"
+// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
-
+\n\
-import * as XLSX from 'https://cdn.sheetjs.com/xlsx-0.18.3/package/xlsx.mjs';
+import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
-
+\n\
-import * as cptable from 'https://cdn.sheetjs.com/xlsx-0.18.3/package/dist/cpexcel.full.mjs';
+import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
`}
-</code></pre>
+</CodeBlock>
#### Deno Registry
diff --git a/docz/docs/02-getting-started/01-installation/07-bun.md b/docz/docs/02-getting-started/01-installation/07-bun.md
index 46fba58..0122d6b 100644
--- a/docz/docs/02-getting-started/01-installation/07-bun.md
+++ b/docz/docs/02-getting-started/01-installation/07-bun.md
@@ -10,9 +10,9 @@ import current from '/version.js';
# Bun
-Each standalone release script is available at <https://cdn.sheetjs.com/>.
+Module scripts are available at <https://cdn.sheetjs.com/>.
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/xlsx.mjs</a> is the URL for {current}</div><br/>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/xlsx.mjs</a> is the URL for {current}</p>
After downloading the script, it can be directly imported:
@@ -41,7 +41,7 @@ new versions are released!
If Encoding support is required, `cpexcel.full.mjs` must be manually imported.
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/cpexcel.full.mjs</a> is the URL for {current}</div><br/>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/cpexcel.full.mjs</a> is the URL for {current}</p>
```ts
diff --git a/docz/docs/02-getting-started/02-example.mdx b/docz/docs/02-getting-started/02-example.mdx
index 745469d..0df6cb4 100644
--- a/docz/docs/02-getting-started/02-example.mdx
+++ b/docz/docs/02-getting-started/02-example.mdx
@@ -192,34 +192,24 @@ worksheet["!cols"] = [ { wch: max_width } ];
</details>
+After cleanup, the generated workbook looks like the screenshot below:
+
+
+
## Export a File
`XLSX.writeFile` creates a spreadsheet file and tries to write it to the system.
In the browser, it will try to prompt the user to download the file. In NodeJS,
it will write to the local directory.
-:::note
-
-`XLSX.writeFileXLSX` only writes XLSX files and is recommended when the export
-will always be in the `.xlsx` format. `writeFileXLSX` is more amenable to tree
-shaking. This example uses `XLSX.writeFile` since `writeFileXLSX` does not
-support other common export formats like `.xls` or `.xlsb` or `.csv`.
-
-`compression: true` enables ZIP compression for XLSX and other formats.
-
-:::
-
```js
XLSX.writeFile(workbook, "Presidents.xlsx", { compression: true });
```
-
-
-
## Live Demo
This demo runs in the web browser! Click "Click to Generate File!" and the
-browser should generate a XLSX file.
+browser should try to create `Presidents.xlsx`
```jsx live
function Presidents() { return ( <button onClick={async () => {
@@ -257,17 +247,16 @@ function Presidents() { return ( <button onClick={async () => {
}}><b>Click to Generate file!</b></button> ); }
```
+<https://sheetjs.com/pres.html> is a hosted version of this demo.
+
## Run the Demo Locally
<Tabs>
<TabItem value="browser" label="Web Browser">
-Save the following script to `snippet.html` and open the page. The page must be
-hosted (no `file:///` access).
+Save the following script to `SheetJSStandaloneDemo.html`:
-<https://sheetjs.com/pres.html> is a hosted version of the page.
-
-<CodeBlock language="html" title="snippet.html">{`\
+<CodeBlock language="html" title="SheetJSStandaloneDemo.html">{`\
<body>
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
<script>
@@ -308,6 +297,16 @@ hosted (no `file:///` access).
</body>`}
</CodeBlock>
+After saving the file, run a local web server in the folder with the HTML file.
+For example, if NodeJS is installed:
+
+```bash
+npx http-server .
+```
+
+The server process will display a URL (typically `http://127.0.0.1:8080`). Open
+`http://127.0.0.1:8080/SheetJSStandaloneDemo.html` in your browser.
+
</TabItem>
<TabItem value="nodejs" label="Command-Line (NodeJS)">
@@ -317,9 +316,9 @@ Install the dependencies:
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
</CodeBlock>
-Save the following script to `snippet.js` and run `node snippet.js`:
+Save the following script to `SheetJSNodeJS.js`:
-```js title="snippet.js"
+```js title="SheetJSNodeJS.js"
const XLSX = require("xlsx");
(async() => {
@@ -357,6 +356,14 @@ const XLSX = require("xlsx");
})();
```
+After saving the script, run the script:
+
+```bash
+node SheetJSNodeJS.js
+```
+
+This script will write a new file `Presidents.xlsx` in the same folder.
+
:::caution
Native `fetch` support was added in NodeJS 18. For older versions of NodeJS,
@@ -367,13 +374,13 @@ like `axios` presents a similar API for fetching data:
Install the dependencies:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz axios`}
-</code></pre>
+</CodeBlock>
-The differences in the script are highlighted below.
+Save the following script to `SheetJSAxios.js` (differences are highlighted):
-```js title="snippet.js"
+```js title="SheetJSAxios.js"
const XLSX = require("xlsx");
// highlight-next-line
const axios = require("axios");
@@ -414,6 +421,14 @@ const axios = require("axios");
})();
```
+After saving the script, run the script:
+
+```bash
+node SheetJSAxios.js
+```
+
+This script will write a new file `Presidents.xlsx` in the same folder.
+
</details>
:::
@@ -423,9 +438,9 @@ const axios = require("axios");
<Tabs>
<TabItem value="deno" label="Deno">
-Save the following script to `snippet.ts` and run `deno run -A snippet.ts`:
+Save the following script to `SheetJSDeno.ts`:
-<CodeBlock language="ts" title="snippet.ts">{`\
+<CodeBlock language="ts" title="SheetJSDeno.ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
\n\
@@ -462,14 +477,26 @@ worksheet["!cols"] = [ { wch: max_width } ];
XLSX.writeFile(workbook, "Presidents.xlsx", { compression: true });`}
</CodeBlock>
+After saving the script, run the script:
+
+```bash
+deno run -A SheetJSDeno.ts
+```
+
+This script will write a new file `Presidents.xlsx` in the same folder.
+
</TabItem>
<TabItem value="bun" label="Bun">
-<div>Download <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/xlsx.mjs</a> to <code>xlsx.mjs</code></div>
+<p>Download <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/xlsx.mjs</a> to <code>xlsx.mjs</code>:</p>
-Save the following script to `snippet.js` and run with `bun snippet.js`:
+<CodeBlock language="bash">{`\
+curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs`}
+</CodeBlock>
-```js title="snippet.js"
+Save the following script to `SheetJSBun.js`:
+
+```js title="SheetJSBun.js"
import * as XLSX from './xlsx.mjs';
import * as fs from 'fs';
XLSX.set_fs(fs);
@@ -507,6 +534,14 @@ worksheet["!cols"] = [ { wch: max_width } ];
XLSX.writeFile(workbook, "Presidents.xlsx", { compression: true });
```
+After saving the script, run the script:
+
+```bash
+bun SheetJSBun.js
+```
+
+This script will write a new file `Presidents.xlsx` in the same folder.
+
</TabItem>
</Tabs>
@@ -516,9 +551,9 @@ XLSX.writeFile(workbook, "Presidents.xlsx", { compression: true });
<TabItem value="desktop" label="Desktop App">
-Save the following script to `snippet.html`:
+Save the following script to `SheetJSNW.html`:
-<CodeBlock language="html" title="snippet.html">{`\
+<CodeBlock language="html" title="SheetJSNW.html">{`\
<body>
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
<script>
@@ -566,7 +601,7 @@ Save the following to `package.json`:
"name": "sheetjs-nwjs",
"author": "sheetjs",
"version": "0.0.0",
- "main": "snippet.html",
+ "main": "SheetJSNW.html",
"dependencies": {
"nw": "~0.66.0",
"xlsx": "https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz"
@@ -596,19 +631,19 @@ of the React Native documentation before testing the demo.
Create a new project by running the following commands in the Terminal:
<CodeBlock language="bash">{`\
-npx react-native@0.70.6 init SheetJSPres --version="0.70.6"
+npx react-native@0.71 init SheetJSPres --version="0.72.0-rc.1"
cd SheetJSPres
\n\
npm i -S https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz react-native-blob-util@0.17.1`}
</CodeBlock>
-Save the following to `App.js` in the project:
+Save the following to `App.tsx` in the project:
-```js title="App.js"
+```js title="App.tsx"
import React from 'react';
import { Alert, Button, SafeAreaView, Text, View } from 'react-native';
import { utils, version, write } from 'xlsx';
-import RNFetchBlob from 'react-native-blob-util';
+import RNBU from 'react-native-blob-util';
const make_workbook = async() => {
/* fetch JSON data and parse */
@@ -646,8 +681,15 @@ const make_workbook = async() => {
const buf = write(workbook, {type:'buffer', bookType:"xlsx"});
/* write buffer to file */
- const filename = RNFetchBlob.fs.dirs.DocumentDir + "/Presidents.xlsx";
- await RNFetchBlob.fs.writeFile(filename, Array.from(buf), 'ascii');
+ const filename = RNBU.fs.dirs.DocumentDir + "/Presidents.xlsx";
+ await RNBU.fs.writeFile(filename, Array.from(buf), 'ascii');
+
+ /* Copy to downloads directory (android) */
+ try { await RNBU.MediaCollection.copyToMediaStore({
+ parentFolder: "",
+ mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+ name: "Presidents.xlsx"
+ }, "Download", filename); } catch(e) {}
return filename;
};
@@ -713,27 +755,13 @@ base64 -D pres.b64 > Presidents.xlsx
This command generates `Presidents.xlsx` which can be opened.
-:::note Device Testing
+:::info Device Testing
-For testing on a real device, Android 10+ requires an additional step to access
-the generated file. Add highlighted lines to `App.js`:
+["Running on Device"](https://reactnative.dev/docs/running-on-device) in the
+React Native docs covers device configuration.
-```jsx title="App.js"
- /* write buffer to file */
- const filename = RNFetchBlob.fs.dirs.DocumentDir + "/Presidents.xlsx";
- await RNFetchBlob.fs.writeFile(filename, Array.from(buf), 'ascii');
-// highlight-start
- await RNFetchBlob.MediaCollection.copyToMediaStore({
- parentFolder: "",
- mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
- name: "Presidents.xlsx"
- }, "Download", filename);
-// highlight-end
-
- return filename;
-```
-
-`Presidents.xlsx` will be copied to the `Downloads` folder.
+`Presidents.xlsx` will be copied to the `Downloads` folder. The file is visible
+in the Files app and can be opened with the Google Sheets app.
:::
@@ -761,6 +789,37 @@ npm run ios
After clicking "Press to Export", the app will show an alert with the location
to the generated file.
+:::info Device Testing
+
+["Running on Device"](https://reactnative.dev/docs/running-on-device) in the
+React Native docs covers device configuration.
+
+The `UIFileSharingEnabled` and `LSSupportsOpeningDocumentsInPlace` entitlements
+are required for iOS to show the generated files in the "Files" app.
+
+The highlighted lines should be added to the iOS project `Info.plist` just
+before the last `</dict>` tag:
+
+```xml title="ios/SheetJSPres/Info.plist"
+ <key>UIViewControllerBasedStatusBarAppearance</key>
+ <false/>
+<!-- highlight-start -->
+ <key>UIFileSharingEnabled</key>
+ <true/>
+ <key>LSSupportsOpeningDocumentsInPlace</key>
+ <true/>
+<!-- highlight-end -->
+</dict>
+</plist>
+```
+
+After adding the settings and rebuilding the app, the file will be visible in
+the "Files" app. Under "On My iPhone", there will be a folder `SheetJSPres`.
+Within the folder there will be a file named `Presidents`. Touch the file to
+see a preview of the data. The Numbers app can open the file.
+
+:::
+
</TabItem>
</Tabs>
diff --git a/docz/docs/03-demos/01-frontend/01-react.md b/docz/docs/03-demos/01-frontend/01-react.md
index 403868a..8025419 100644
--- a/docz/docs/03-demos/01-frontend/01-react.md
+++ b/docz/docs/03-demos/01-frontend/01-react.md
@@ -6,6 +6,7 @@ sidebar_position: 1
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
ReactJS is a JS library for building user interfaces.
@@ -133,12 +134,12 @@ This demo was last run on 2023 February 28 using `create-react-app@5.0.1` and
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-react
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm start`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:3000`)
@@ -213,12 +214,12 @@ This demo was last run on 2023 February 28 using `create-react-app@5.0.1` and
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-react
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm start`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:3000`)
diff --git a/docz/docs/03-demos/01-frontend/02-vue.md b/docz/docs/03-demos/01-frontend/02-vue.md
index d0b8bcb..fe5ea4e 100644
--- a/docz/docs/03-demos/01-frontend/02-vue.md
+++ b/docz/docs/03-demos/01-frontend/02-vue.md
@@ -6,6 +6,7 @@ sidebar_position: 2
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
VueJS is a JS library for building user interfaces.
@@ -129,12 +130,12 @@ This demo was last run on 2023 April 06 using `vue@3.2.47`. When running
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-vue
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm run dev`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:5173`)
@@ -205,12 +206,12 @@ This demo was last run on 2023 April 06 using `vue@3.2.47`. When running
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-vue
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm run dev`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:5173`)
diff --git a/docz/docs/03-demos/01-frontend/03-angular.md b/docz/docs/03-demos/01-frontend/03-angular.md
index 68d4b3f..e827818 100644
--- a/docz/docs/03-demos/01-frontend/03-angular.md
+++ b/docz/docs/03-demos/01-frontend/03-angular.md
@@ -8,6 +8,7 @@ sidebar_position: 3
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
Angular is a JS library for building user interfaces.
@@ -163,13 +164,13 @@ This demo was last run on 2023 February 21 using Angular CLI `15.1.6`
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-angular
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npx @angular/cli analytics disable
npm start`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:4200`)
@@ -251,13 +252,13 @@ This demo was last run on 2023 February 21 using Angular CLI `15.1.6`
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-angular
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npx @angular/cli analytics disable
npm start`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:4200`)
@@ -591,10 +592,10 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
2) install project and dependencies:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i
npm i -S https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
3) start a local server with
diff --git a/docz/docs/03-demos/01-frontend/04-svelte.md b/docz/docs/03-demos/01-frontend/04-svelte.md
index 533fb93..8472f6c 100644
--- a/docz/docs/03-demos/01-frontend/04-svelte.md
+++ b/docz/docs/03-demos/01-frontend/04-svelte.md
@@ -6,6 +6,7 @@ sidebar_position: 4
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Svelte is a JS library for building user interfaces.
@@ -130,12 +131,12 @@ This demo was last run on 2023 March 08 using `svelte@3.55.1`. When running
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-svelte
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm run dev`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:5173`)
@@ -208,12 +209,12 @@ This demo was last run on 2023 March 08 using `svelte@3.55.1`. When running
2) Install the SheetJS dependency and start the dev server:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd sheetjs-svelte
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm run dev`}
-</code></pre>
+</CodeBlock>
3) Open a web browser and access the displayed URL (`http://localhost:5173`)
diff --git a/docz/docs/03-demos/01-frontend/08-bundler.md b/docz/docs/03-demos/01-frontend/08-bundler.md
index 801a507..4dfbcf3 100644
--- a/docz/docs/03-demos/01-frontend/08-bundler.md
+++ b/docz/docs/03-demos/01-frontend/08-bundler.md
@@ -48,21 +48,21 @@ Web Worker scripts can be bundled using the same approach.
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -100,21 +100,21 @@ local testing, a bundled script can save tens of milliseconds per run.
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -195,21 +195,21 @@ Both the `node` and `browser` platforms work out of the box.
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -273,21 +273,21 @@ npx http-server .
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -413,21 +413,21 @@ document.getElementById("xport").onclick = async() => {
2) Install the SheetJS node module:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -480,21 +480,21 @@ Rollup requires `@rollup/plugin-node-resolve` to support NodeJS modules:
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} rollup @rollup/plugin-node-resolve
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} rollup @rollup/plugin-node-resolve
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} rollup @rollup/plugin-node-resolve
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -574,21 +574,21 @@ Snowpack works with no caveats.
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -673,21 +673,21 @@ SWC provides `spack` for bundling scripts.
1) Install the dependencies using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} regenerator-runtime @swc/cli @swc/core
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} regenerator-runtime @swc/cli @swc/core
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} regenerator-runtime @swc/cli @swc/core
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -898,9 +898,9 @@ a `require` implementation when loading [`main.js`](pathname:///systemjs/main.js
1) Install the dependencies:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz systemjs@0.19`}
-</code></pre>
+</CodeBlock>
2) Save the following script to `SheetJSystem.js`:
@@ -990,9 +990,9 @@ When prompted for **Framework**, select **`vue`** then **`vue-ts`**
2) Add the SheetJS dependency:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
3) Replace `src\components\HelloWorld.vue` with:
@@ -1109,21 +1109,21 @@ import * as XLSX from 'xlsx/dist/xlsx.full.min.js';
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
@@ -1215,21 +1215,21 @@ version above 4.0 can be pinned by locally installing webpack and the CLI tool.
**Webpack 4.x**
```bash
-npm install --save webpack@4.x webpack-cli
+npm i --save webpack@4.x webpack-cli
npx webpack --mode=production
```
**Webpack 5.x**
```bash
-npm install --save webpack@5.x webpack-cli
+npm i --save webpack@5.x webpack-cli
npx webpack --mode=production
```
**Webpack latest**
```bash
-npm install --save webpack webpack-cli
+npm i --save webpack webpack-cli
npx webpack --mode=production
```
@@ -1269,21 +1269,21 @@ WMR follows the same structure as Snowpack
1) Install the tarball using a package manager:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/03-demos/04-static/02-gatsbyjs.md b/docz/docs/03-demos/04-static/02-gatsbyjs.md
index e3848d8..4e0fea3 100644
--- a/docz/docs/03-demos/04-static/02-gatsbyjs.md
+++ b/docz/docs/03-demos/04-static/02-gatsbyjs.md
@@ -7,6 +7,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Gatsby is a framework for creating websites. It uses React components for page
templates and GraphQL for loading data.
@@ -29,13 +30,13 @@ in the parsing logic, issues should then be raised with the SheetJS project.
`gatsby-transformer-excel` uses an older version of the library. It can be
overridden through a `package.json` override in the latest versions of NodeJS:
-<pre><code parentName="pre" {...{"className": "language-json"}}>{`\
+<CodeBlock language="json">{`\
{
"overrides": {
"xlsx": "https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz"
}
}`}
-</code></pre>
+</CodeBlock>
:::
@@ -101,7 +102,7 @@ Open a web browser to the displayed URL (typically `http://localhost:8000/`)
3) Edit `package.json` and add the highlighted lines in the JSON object:
-<pre><code parentName="pre" {...{"className": "language-json"}}>{`\
+<CodeBlock language="json">{`\
{
// highlight-start
"overrides": {
@@ -111,15 +112,15 @@ Open a web browser to the displayed URL (typically `http://localhost:8000/`)
"name": "sheetjs-gatsby",
"version": "1.0.0",
`}
-</code></pre>
+</CodeBlock>
4) Install the library and plugins:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm i --save gatsby-transformer-excel gatsby-source-filesystem
`}
-</code></pre>
+</CodeBlock>
5) Make a `src/data` directory, download <https://sheetjs.com/pres.xlsx>, and
move the downloaded file into the new folder:
diff --git a/docz/docs/03-demos/04-static/05-vitejs.md b/docz/docs/03-demos/04-static/05-vitejs.md
index ee32198..f1c37ec 100644
--- a/docz/docs/03-demos/04-static/05-vitejs.md
+++ b/docz/docs/03-demos/04-static/05-vitejs.md
@@ -132,7 +132,7 @@ This demo was tested on 2023 April 30 against `vite v4.3.3`.
<CodeBlock language="bash">{`\
npm create vite@latest sheetjs-vite -- --template vue-ts
cd sheetjs-vite
-npm install
+npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
</CodeBlock>
diff --git a/docz/docs/03-demos/04-static/07-eleventy.md b/docz/docs/03-demos/04-static/07-eleventy.md
new file mode 100644
index 0000000..37cab45
--- /dev/null
+++ b/docz/docs/03-demos/04-static/07-eleventy.md
@@ -0,0 +1,166 @@
+---
+title: Eleventy
+pagination_prev: demos/net/index
+pagination_next: demos/mobile/index
+---
+
+import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
+
+Eleventy is a static site generator.
+
+The [NodeJS module](/docs/getting-started/installation/nodejs) can be loaded in
+`.eleventy.js` and used in custom data file format parsers.
+
+## Integration Details
+
+### Data File Parser
+
+Custom data file parsers must be registered in `.eleventy.js`
+
+`addDataExtension` accepts a list of file extensions and a parser object.
+
+The parser object must include the options `read: true` and `encoding: null` .
+Eleventy will read files and pass raw `Buffer` objects to the parser callback.
+
+The `parser` callback can parse the data with `XLSX.read`. In this demo, the
+parser will generate an array of row objects using `XLSX.utils.sheet_to_json`:
+
+```js title=".eleventy.js"
+const XLSX = require("xlsx");
+
+/* list of file extensions */
+const exts = [ "numbers", "xlsx", "xlsb", "xls" ].join(", ");
+
+module.exports = (eleventyConfig) => {
+ eleventyConfig.addDataExtension(exts, {
+ /* read file and pass raw Buffer object to parser */
+ // highlight-next-line
+ encoding: null, read: true,
+
+ /* parser callback */
+ parser: (contents) => {
+ /* contents is the data stored as a Buffer */
+ // highlight-next-line
+ const wb = XLSX.read(contents);
+ /* generate array of row objects from first worksheet */
+ return XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
+ }
+ });
+};
+```
+
+### Usage
+
+Spreadsheet files added in the `_data` subdirectory are accessible from template
+files using the name stem.
+
+For example, [`pres.numbers`](https://sheetjs.com/pres.numbers) can be accessed
+using the variable `pres` in a template:
+
+```liquid title="index.njk"
+<table><thead><th>Name</th><th>Index</th></thead>
+ <tbody>
+ {% for row in pres %}
+ <tr>
+ <td>{{ row.Name }}</td>
+ <td>{{ row.Index }}</td>
+ </tr>
+ {% endfor %}
+ </tbody>
+</table>
+```
+
+
+## Complete Example
+
+:::note
+
+This demo was tested on 2023 May 07 using Eleventy `2.0.1`
+
+:::
+
+### Project Setup
+
+1) Create a new project:
+
+```bash
+mkdir sheetjs-11ty
+cd sheetjs-11ty
+npm init -y
+```
+
+2) Install Eleventy and SheetJS libraries:
+
+<CodeBlock language="bash">{`\
+npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz @11ty/eleventy`}
+</CodeBlock>
+
+3) Make a new `_data` subdirectory in the project. Download the example file
+[`pres.xlsx`](https://sheetjs.com/pres.xlsx) into `_data`:
+
+```bash
+mkdir _data
+curl -Lo _data/pres.xlsx https://sheetjs.com/pres.xlsx
+```
+
+4) Download the following files to the project folder:
+
+- [`_eleventy.js`](pathname:///eleventy/_eleventy.js) (rename to `.eleventy.js`)
+- [`index.njk`](pathname:///eleventy/index.njk)
+
+```bash
+curl -L -o .eleventy.js https://docs.sheetjs.com/eleventy/_eleventy.js
+curl -LO https://docs.sheetjs.com/eleventy/index.njk
+```
+
+### Live Reload
+
+5) Start the live reloading server:
+
+```bash
+npx @11ty/eleventy --serve
+```
+
+The server will generate `index.html` from `index.njk` and show the server URL:
+
+```
+[11ty] Writing _site/index.html from ./index.njk
+[11ty] Wrote 1 file in 0.23 seconds (v2.0.1)
+[11ty] Watching…
+[11ty] Server at http://localhost:8080/ <-- this is the URL
+```
+
+6) Open the URL in a web browser. The page should include a table.
+
+7) Open `_data/pres.xlsx` in a spreadsheet editor. Add a new row to the end
+of the list and save the file.
+
+The server log will note that the file changed:
+
+```
+[11ty] File changed: _data/pres.xlsx
+[11ty] Writing _site/index.html from ./index.njk
+```
+
+The browser will refresh to show the new data.
+
+### Static Site
+
+8) Stop the live reload server and build the static site:
+
+```bash
+npx @11ty/eleventy
+```
+
+Eleventy will place the generated site in the `_site` subfolder.
+
+9) Start a web server to host the static site:
+
+```bash
+npx http-server _site
+```
+
+Open a web browser and access the displayed URL ( `http://localhost:8080` ).
+View the page source and confirm that no JS was added to the page. It only
+contains the content from the file in an HTML table.
diff --git a/docz/docs/03-demos/04-static/11-svelte.md b/docz/docs/03-demos/04-static/11-svelte.md
index 646746d..f9a6747 100644
--- a/docz/docs/03-demos/04-static/11-svelte.md
+++ b/docz/docs/03-demos/04-static/11-svelte.md
@@ -5,6 +5,7 @@ pagination_next: demos/mobile/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::note
@@ -186,9 +187,9 @@ curl -Lo data/pres.xlsx https://sheetjs.com/pres.xlsx
3) Install the SheetJS library:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
4) Replace the contents of `vite.config.js` with the contents of the code block
named [`vite.config.js` in the "Loader" section](#loader)
@@ -223,7 +224,7 @@ the file. After saving, the browser should automatically refresh with new data.
11) Stop the development server and install the static adapter:
```bash
-npm install --save @sveltejs/adapter-static
+npm i --save @sveltejs/adapter-static
```
12) Edit `svelte.config.js` to use the new adapter:
diff --git a/docz/docs/03-demos/04-static/10-astro.md b/docz/docs/03-demos/04-static/12-astro.md
similarity index 98%
rename from docz/docs/03-demos/04-static/10-astro.md
rename to docz/docs/03-demos/04-static/12-astro.md
index 335fb3d..4d71ace 100644
--- a/docz/docs/03-demos/04-static/10-astro.md
+++ b/docz/docs/03-demos/04-static/12-astro.md
@@ -5,6 +5,7 @@ pagination_next: demos/mobile/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::note
@@ -151,9 +152,9 @@ curl -Lo src/data/pres.numbers https://sheetjs.com/pres.numbers
3) Install the SheetJS library:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
4) Replace `src/pages/index.astro` with the following:
diff --git a/docz/docs/03-demos/05-mobile/02-nativescript.md b/docz/docs/03-demos/05-mobile/02-nativescript.md
index 48bbd8e..c889f0d 100644
--- a/docz/docs/03-demos/05-mobile/02-nativescript.md
+++ b/docz/docs/03-demos/05-mobile/02-nativescript.md
@@ -8,6 +8,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
The [NodeJS Module](/docs/getting-started/installation/nodejs) can be imported
from the main entrypoint or any script in the project.
@@ -110,9 +111,9 @@ selecting the terminal and entering the key sequence `CTRL + C`
3) From the project folder, install the library:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
4) To confirm the library was loaded, change the title to show the version. The
differences are highlighted.
diff --git a/docz/docs/03-demos/05-mobile/03-quasar.md b/docz/docs/03-demos/05-mobile/03-quasar.md
index 7b0a881..a0829f4 100644
--- a/docz/docs/03-demos/05-mobile/03-quasar.md
+++ b/docz/docs/03-demos/05-mobile/03-quasar.md
@@ -8,6 +8,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
The [NodeJS Module](/docs/getting-started/installation/nodejs) can be imported
from the main entrypoint or any script in the project.
@@ -154,11 +155,11 @@ When prompted:
<!-- spellchecker-enable -->
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd SheetJSQuasar
npm i
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
3) Set up Cordova:
diff --git a/docz/docs/03-demos/05-mobile/04-ionic.md b/docz/docs/03-demos/05-mobile/04-ionic.md
index 18a9076..6fc1bcd 100644
--- a/docz/docs/03-demos/05-mobile/04-ionic.md
+++ b/docz/docs/03-demos/05-mobile/04-ionic.md
@@ -144,7 +144,7 @@ cd SheetJSIonic
ionic cordova plugin add cordova-plugin-file
ionic cordova platform add ios --confirm
ionic cordova platform add android --confirm
-npm install --save @ionic-native/core @ionic-native/file @ionic/cordova-builders
+npm i --save @ionic-native/core @ionic-native/file @ionic/cordova-builders
```
:::note
@@ -166,7 +166,7 @@ ionic cordova platform add ios --confirm
:::caution
-If the `npm install` fails due to `rxjs` resolution, add the highlighted lines
+If the `npm i` fails due to `rxjs` resolution, add the highlighted lines
to `package.json` to force a resolution:
```js title="package.json"
@@ -179,14 +179,14 @@ to `package.json` to force a resolution:
"dependencies": {
```
-After adding the lines, the `npm install` command will succeed.
+After adding the lines, the `npm i` command will succeed.
:::
3) Install dependencies:
<CodeBlock language="bash">{`\
-npm install --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
+npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
</CodeBlock>
4) Add `@ionic-native/file` to the module. Differences highlighted below:
diff --git a/docz/docs/03-demos/05-mobile/05-capacitor.md b/docz/docs/03-demos/05-mobile/05-capacitor.md
index da2311a..cc8cc3c 100644
--- a/docz/docs/03-demos/05-mobile/05-capacitor.md
+++ b/docz/docs/03-demos/05-mobile/05-capacitor.md
@@ -8,6 +8,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
The [NodeJS Module](/docs/getting-started/installation/nodejs) can be imported
from the main entrypoint or any script in the project.
@@ -148,10 +149,10 @@ cd sheetjs-cap
3) Install dependencies:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm i --save @capacitor/core @capacitor/cli @capacitor/filesystem`}
-</code></pre>
+</CodeBlock>
4) Create CapacitorJS structure:
diff --git a/docz/docs/03-demos/06-desktop/01-electron.md b/docz/docs/03-demos/06-desktop/01-electron.md
index 35f95dd..ff2a19b 100644
--- a/docz/docs/03-demos/06-desktop/01-electron.md
+++ b/docz/docs/03-demos/06-desktop/01-electron.md
@@ -218,7 +218,7 @@ curl -LO https://docs.sheetjs.com/electron/index.html
curl -LO https://docs.sheetjs.com/electron/index.js
```
-2) Run `npm install` to install dependencies.
+2) Run `npm i` to install dependencies.
3) To verify the app works, run in the test environment:
diff --git a/docz/docs/03-demos/06-desktop/02-nwjs.md b/docz/docs/03-demos/06-desktop/02-nwjs.md
index 1814f5e..ea581b1 100644
--- a/docz/docs/03-demos/06-desktop/02-nwjs.md
+++ b/docz/docs/03-demos/06-desktop/02-nwjs.md
@@ -143,7 +143,7 @@ In the terminal window, the download can be performed with:
curl -LO https://docs.sheetjs.com/nwjs/index.html
```
-3) Run `npm install` to install dependencies
+3) Run `npm i` to install dependencies
4) To verify the app works, run in the test environment:
diff --git a/docz/docs/03-demos/06-desktop/06-reactnative.md b/docz/docs/03-demos/06-desktop/06-reactnative.md
index db747ac..b1159c5 100644
--- a/docz/docs/03-demos/06-desktop/06-reactnative.md
+++ b/docz/docs/03-demos/06-desktop/06-reactnative.md
@@ -10,6 +10,7 @@ sidebar_custom_props:
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
:::note
@@ -249,9 +250,9 @@ npx react-native-windows-init --no-telemetry --overwrite
Install the SheetJS library:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
To ensure that the app works, launch the app:
@@ -456,9 +457,9 @@ npx react-native-macos-init --no-telemetry
Install the SheetJS library:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
To ensure that the app works, launch the app:
diff --git a/docz/docs/03-demos/06-desktop/09-cli.md b/docz/docs/03-demos/06-desktop/09-cli.md
index fcc51be..8639860 100644
--- a/docz/docs/03-demos/06-desktop/09-cli.md
+++ b/docz/docs/03-demos/06-desktop/09-cli.md
@@ -9,6 +9,7 @@ sidebar_custom_props:
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
With the availability of JS engines and the success of server-side platforms,
it is feasible to build command-line tools for various workflows.
@@ -68,21 +69,21 @@ Options:
2) Install the dependencies:
-<Tabs>
+<Tabs groupId="pm">
<TabItem value="npm" label="npm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz exit-on-epipe commander@2`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="pnpm" label="pnpm">
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz exit-on-epipe commander@2`}
-</code></pre>
+</CodeBlock>
</TabItem>
<TabItem value="yarn" label="Yarn" default>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz exit-on-epipe commander@2`}
-</code></pre>
+</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/03-demos/07-data/09-alasql.md b/docz/docs/03-demos/07-data/09-alasql.md
index e3ec743..e696fa0 100644
--- a/docz/docs/03-demos/07-data/09-alasql.md
+++ b/docz/docs/03-demos/07-data/09-alasql.md
@@ -99,18 +99,18 @@ function SheetJSAlaSQL() {
The [Standalone scripts](/docs/getting-started/installation/standalone) should
be loaded before the `alasql` script:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js"></script>
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/alasql"></script>`}
-</code></pre>
+</CodeBlock>
#### Frameworks and Bundlers
`alasql` uses an older version of the library. It can be overridden through a
`package.json` override. The lines should be added *before* installing `alasql`:
-<pre><code parentName="pre" {...{"className": "language-json"}}>{`\
+<CodeBlock language="json">{`\
{
/* add this part before "name" */
/* highlight-start */
@@ -121,12 +121,12 @@ be loaded before the `alasql` script:
"name": "my-project",
/* ... more fields ... */
`}
-</code></pre>
+</CodeBlock>
After adding the override, AlaSQL can be installed through `npm`:
```bash
-npm install --save alasql
+npm i --save alasql
```
In imports, the SheetJS library must be passed to AlaSQL as shown below:
@@ -200,13 +200,13 @@ const { promise: alasql } = require("alasql");
`alasql` uses an older version of the library. It can be overridden through a
`package.json` override in the latest versions of NodeJS:
-<pre><code parentName="pre" {...{"className": "language-json"}}>{`\
+<CodeBlock language="json">{`\
{
"overrides": {
"xlsx": "https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz"
}
}`}
-</code></pre>
+</CodeBlock>
:::
@@ -314,7 +314,7 @@ node SheetJSAlaSQL.js
The output should display:
-```
+```js
[
{ Name: 'Bill Clinton', Index: 42 },
{ Name: 'GeorgeW Bush', Index: 43 },
diff --git a/docz/docs/03-demos/07-data/14-knex.md b/docz/docs/03-demos/07-data/14-knex.md
index 72cdba6..9e5af6d 100644
--- a/docz/docs/03-demos/07-data/14-knex.md
+++ b/docz/docs/03-demos/07-data/14-knex.md
@@ -7,6 +7,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::note
@@ -39,9 +40,9 @@ const worksheet = XLSX.utils.json_to_sheet(aoo);
1) Install dependencies:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz knex better-sqlite3`}
-</code></pre>
+</CodeBlock>
2) Download the [test file](https://sheetjs.com/pres.numbers)
diff --git a/docz/docs/03-demos/07-data/26-redis.md b/docz/docs/03-demos/07-data/26-redis.md
index d718ee0..71a49d1 100644
--- a/docz/docs/03-demos/07-data/26-redis.md
+++ b/docz/docs/03-demos/07-data/26-redis.md
@@ -7,6 +7,7 @@ sidebar_custom_props:
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Redis has 5 core data types: "String", List", "Set", "Sorted Set", and "Hash".
Since the keys and values are limited to simple strings (and numbers), it is
@@ -203,10 +204,10 @@ curl -LO https://docs.sheetjs.com/nosql/SheetJSRedisTest.mjs
2) Install dependencies and run:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz redis@4.6.4
node SheetJSRedisTest.mjs`}
-</code></pre>
+</CodeBlock>
Inspect the output and compare with the data in `SheetJSRedisTest.mjs`.
diff --git a/docz/docs/03-demos/09-cloud/02-aws.md b/docz/docs/03-demos/09-cloud/02-aws.md
index 9dc2e65..faecfb9 100644
--- a/docz/docs/03-demos/09-cloud/02-aws.md
+++ b/docz/docs/03-demos/09-cloud/02-aws.md
@@ -5,6 +5,7 @@ pagination_next: demos/extensions/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
AWS is a Cloud Services platform which includes traditional virtual machine
support, "Serverless Functions", cloud storage and much more.
@@ -138,10 +139,10 @@ curl -LO https://docs.sheetjs.com/aws/index.js
2) Install dependencies in the project directory;
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
mkdir -p node_modules
-npm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz busboy`}
-</code></pre>
+npm i https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz busboy`}
+</CodeBlock>
3) Create a .zip package of the contents of the folder:
diff --git a/docz/docs/03-demos/09-cloud/08-airtable.md b/docz/docs/03-demos/09-cloud/08-airtable.md
index 11594d6..0f4f11e 100644
--- a/docz/docs/03-demos/09-cloud/08-airtable.md
+++ b/docz/docs/03-demos/09-cloud/08-airtable.md
@@ -5,6 +5,7 @@ pagination_next: demos/extensions/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Airtable recommends Personal Access Tokens for interacting with their API. When
fetching data from the API, the result will include an array of row objects that
@@ -15,9 +16,9 @@ to write data will accept row objects generated by `XLSX.utils.sheet_to_json`.
The main module is `airtable` and can be installed with `npm`:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz airtable`}
-</code></pre>
+</CodeBlock>
To obtain a reference to a table, code needs a [PAT](#personal-access-token),
the name of the workspace (typically starting with `app`), and the name of the
diff --git a/docz/docs/03-demos/09-cloud/index.md b/docz/docs/03-demos/09-cloud/index.md
index 3bbfe8e..46b24c8 100644
--- a/docz/docs/03-demos/09-cloud/index.md
+++ b/docz/docs/03-demos/09-cloud/index.md
@@ -44,7 +44,7 @@ File hosting services provide simple solutions for storing data, synchronizing
files across devices, and sharing with specific users or customers. Demos:
- [Dropbox](/docs/demos/cloud/dropbox)
-- [Github](/docs/demos/cloud/github)
+- [GitHub](/docs/demos/cloud/github)
## Cloud Data
diff --git a/docz/docs/03-demos/10-extensions/03-excelapi.md b/docz/docs/03-demos/10-extensions/03-excelapi.md
index 9da223d..fc1f053 100644
--- a/docz/docs/03-demos/10-extensions/03-excelapi.md
+++ b/docz/docs/03-demos/10-extensions/03-excelapi.md
@@ -5,6 +5,7 @@ pagination_next: demos/bigdata/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::info
@@ -93,7 +94,7 @@ async function extern(url) {
2) Install dependencies in a new PowerShell window:
```powershell
-npm install -g yo bower generator-office
+npm i -g yo bower generator-office
```
### Creating a new Add-in
@@ -134,9 +135,9 @@ element with name `bt:String`. Change the `DefaultValue` attribute to `SHEETJS`:
7) Install the SheetJS library in the project
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
8) Replace `src\functions\functions.js` with the following:
diff --git a/docz/docs/03-demos/10-extensions/04-gsheet.md b/docz/docs/03-demos/10-extensions/04-gsheet.md
index 99c5cdf..1adf10b 100644
--- a/docz/docs/03-demos/10-extensions/04-gsheet.md
+++ b/docz/docs/03-demos/10-extensions/04-gsheet.md
@@ -140,9 +140,9 @@ and paste in the terminal. Press Enter after pasting the ID.
7) Download the standalone build and move to the project directory:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}
-</code></pre>
+</CodeBlock>
8) Push the project to Apps Script:
diff --git a/docz/docs/03-demos/10-extensions/05-osa.md b/docz/docs/03-demos/10-extensions/05-osa.md
index d20f7a5..2f792ad 100644
--- a/docz/docs/03-demos/10-extensions/05-osa.md
+++ b/docz/docs/03-demos/10-extensions/05-osa.md
@@ -7,6 +7,7 @@ pagination_next: demos/bigdata/index
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
Open Scripting Architecture (OSA), a built-in feature in macOS introduced in
1993, enables users to communicate with applications with a standardized
@@ -145,10 +146,10 @@ data in CSV format.
0) Download the standalone script and test file:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://sheetjs.com/pres.numbers
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}
-</code></pre>
+</CodeBlock>
<Tabs groupId="osa">
<TabItem value="js" label="JavaScript">
diff --git a/docz/docs/03-demos/10-extensions/06-mathematica.md b/docz/docs/03-demos/10-extensions/06-mathematica.md
index 5c59024..f2e00c2 100644
--- a/docz/docs/03-demos/10-extensions/06-mathematica.md
+++ b/docz/docs/03-demos/10-extensions/06-mathematica.md
@@ -5,6 +5,7 @@ pagination_next: demos/bigdata/index
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::note
@@ -56,12 +57,12 @@ This demo was tested in macOS. The path names will differ in other platforms.
1) Create the standalone `xlsx-cli` binary:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
cd /tmp
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz exit-on-epipe commander@2
curl -LO https://docs.sheetjs.com/cli/xlsx-cli.js
npx nexe -t 14.15.3 xlsx-cli.js`}
-</code></pre>
+</CodeBlock>
This is discussed in ["Command-line Tools"](/docs/demos/desktop/cli)
diff --git a/docz/docs/03-demos/12-engines/01_duktape.md b/docz/docs/03-demos/12-engines/01_duktape.md
index 488abac..384c7e6 100644
--- a/docz/docs/03-demos/12-engines/01_duktape.md
+++ b/docz/docs/03-demos/12-engines/01_duktape.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Duktape is an embeddable JS engine written in C. It has been ported to a number
of exotic architectures and operating systems.
@@ -139,11 +140,11 @@ mv duktape-2.7.0/src/*.{c,h} .
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
2) Download [`sheetjs.duk.c`](pathname:///duk/sheetjs.duk.c):
diff --git a/docz/docs/03-demos/12-engines/02_jsc.md b/docz/docs/03-demos/12-engines/02_jsc.md
index 9142965..fefb8cb 100644
--- a/docz/docs/03-demos/12-engines/02_jsc.md
+++ b/docz/docs/03-demos/12-engines/02_jsc.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
iOS and MacOS ship with the JavaScriptCore framework for running JS code from
Swift and Objective-C. Hybrid function invocation is tricky, but explicit data
@@ -133,10 +134,10 @@ cd sheetjswift
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
2) Download the Swift scripts for the demo
diff --git a/docz/docs/03-demos/12-engines/03_rhino.md b/docz/docs/03-demos/12-engines/03_rhino.md
index 6b9f19f..1003726 100644
--- a/docz/docs/03-demos/12-engines/03_rhino.md
+++ b/docz/docs/03-demos/12-engines/03_rhino.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Rhino is an ES3+ engine in Java.
@@ -140,10 +141,10 @@ curl -L -o rhino.jar https://github.com/mozilla/rhino/releases/download/Rhino1_7
<li><a href="https://sheetjs.com/pres.xlsx">pres.xlsx</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.xlsx`}
-</code></pre>
+</CodeBlock>
2) Download [`SheetJSRhino.zip`](pathname:///rhino/SheetJSRhino.zip) and unzip
diff --git a/docz/docs/03-demos/12-engines/04_nashorn.md b/docz/docs/03-demos/12-engines/04_nashorn.md
index d9ddca2..b0f7380 100644
--- a/docz/docs/03-demos/12-engines/04_nashorn.md
+++ b/docz/docs/03-demos/12-engines/04_nashorn.md
@@ -7,6 +7,7 @@ pagination_next: solutions/input
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
Nashorn is a JavaScript engine for Java. It shipped with Java distributions
starting with Java 8 and was eventually removed in Java 15. The project was
@@ -128,11 +129,11 @@ curl -LO "https://search.maven.org/remotecontent?filepath=org/ow2/asm/asm-util/9
<li><a href="https://sheetjs.com/pres.xlsx">pres.xlsx</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js
curl -LO https://sheetjs.com/pres.xlsx`}
-</code></pre>
+</CodeBlock>
2) Download [`SheetJSNashorn.java`](pathname:///nashorn/SheetJSNashorn.java):
diff --git a/docz/docs/03-demos/12-engines/05_goja.md b/docz/docs/03-demos/12-engines/05_goja.md
index 406124d..723acb5 100644
--- a/docz/docs/03-demos/12-engines/05_goja.md
+++ b/docz/docs/03-demos/12-engines/05_goja.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Goja is a pure Go implementation of ECMAScript 5.
@@ -110,11 +111,11 @@ go get github.com/dop251/goja
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
2) Download [`SheetGoja.go`](pathname:///goja/SheetGoja.go):
diff --git a/docz/docs/03-demos/12-engines/07_chakra.md b/docz/docs/03-demos/12-engines/07_chakra.md
index ebb4b4b..d304e41 100644
--- a/docz/docs/03-demos/12-engines/07_chakra.md
+++ b/docz/docs/03-demos/12-engines/07_chakra.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
ChakraCore is an embeddable JS engine written in C++.
@@ -159,11 +160,11 @@ This program tries to parse the file specified by the first argument
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
5) Run the test program:
diff --git a/docz/docs/03-demos/12-engines/08_quickjs.md b/docz/docs/03-demos/12-engines/08_quickjs.md
index 3430d84..868591b 100644
--- a/docz/docs/03-demos/12-engines/08_quickjs.md
+++ b/docz/docs/03-demos/12-engines/08_quickjs.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
QuickJS is an embeddable JS engine written in C. It provides a separate set of
functions for interacting with the filesystem and the global object. It can run
@@ -163,10 +164,10 @@ This program tries to parse the file specified by the first argument
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
5) Run the test program:
@@ -195,10 +196,10 @@ This demo was last tested on 2023 March 11 against QuickJS `2021-03-27`.
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
2) Download [`SheetJSQuick.js`](pathname:///quickjs/SheetJSQuick.js)
diff --git a/docz/docs/03-demos/12-engines/09_rb.md b/docz/docs/03-demos/12-engines/09_rb.md
index 180cff0..a9cea1e 100644
--- a/docz/docs/03-demos/12-engines/09_rb.md
+++ b/docz/docs/03-demos/12-engines/09_rb.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
ExecJS is a Ruby abstraction over a number of JS runtimes including V8.
@@ -81,10 +82,10 @@ gem install execjs
<li><a href="https://sheetjs.com/pres.numbers">pres.numbers</a></li>
</ul>
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
curl -LO https://sheetjs.com/pres.numbers`}
-</code></pre>
+</CodeBlock>
2) Download [`ExecSheetJS.rb`](pathname:///execjs/ExecSheetJS.rb):
diff --git a/docz/docs/03-demos/12-engines/11_perl.md b/docz/docs/03-demos/12-engines/11_perl.md
index ff8bf4e..b95b855 100644
--- a/docz/docs/03-demos/12-engines/11_perl.md
+++ b/docz/docs/03-demos/12-engines/11_perl.md
@@ -5,6 +5,7 @@ pagination_next: solutions/input
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
:::warning
@@ -113,9 +114,9 @@ cpan install JE
2) Download the [ExtendScript build](/docs/getting-started/installation/extendscript):
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.extendscript.js`}
-</code></pre>
+</CodeBlock>
3) Download the demo [`SheetJE.pl`](pathname:///perl/SheetJE.pl):
diff --git a/docz/docs/03-demos/index.md b/docz/docs/03-demos/index.md
index 9179384..54f0cf0 100644
--- a/docz/docs/03-demos/index.md
+++ b/docz/docs/03-demos/index.md
@@ -61,6 +61,7 @@ run in the web browser, demos will include interactive examples.
- [`Lume`](/docs/demos/static/lume)
- [`GatsbyJS`](/docs/demos/static/gatsbyjs)
+- [`Eleventy`](/docs/demos/static/eleventy)
- [`ViteJS`](/docs/demos/static/vitejs)
- [`NextJS`](/docs/demos/static/nextjs)
- [`NuxtJS`](/docs/demos/static/nuxtjs)
diff --git a/docz/docs/06-solutions/01-input.md b/docz/docs/06-solutions/01-input.md
index e125ae4..e170852 100644
--- a/docz/docs/06-solutions/01-input.md
+++ b/docz/docs/06-solutions/01-input.md
@@ -130,11 +130,11 @@ The [`extendscript` demo](/docs/demos/extendscript) includes a more complex exam
`readFile` uses `Deno.readFileSync` under the hood:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
-
-const workbook = XLSX.readFile("test.xlsx");`}</code></pre>
+\n\
+const workbook = XLSX.readFile("test.xlsx");`}</CodeBlock>
:::note
@@ -330,18 +330,18 @@ The [`server` demo](/docs/demos/server) has more advanced examples.
Drash is a HTTP server framework for Deno. In a `POST` request handler, the
body parser can pull file data into a `Uint8Array`:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
/* load the codepage support library for extended support with older formats */
import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
XLSX.set_cptable(cptable);
-
+\n\
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
-
+\n\
class SheetResource extends Drash.Resource {
public paths = ["/"];
-
+\n\
public POST(request: Drash.Request, response: Drash.Response) {
// highlight-next-line
const file = request.bodyParam<Drash.Types.BodyFile>("file");
@@ -352,15 +352,15 @@ class SheetResource extends Drash.Resource {
return response.html(html);
}
}
-
+\n\
const server = new Drash.Server({ hostname: "", port: 7262, protocol: "http",
resources: [
// highlight-next-line
SheetResource,
],
});
-
-server.run();`}</code></pre>
+\n\
+server.run();`}</CodeBlock>
:::note
@@ -432,7 +432,7 @@ The [`xhr` demo](/docs/demos/network) includes a longer discussion and more exam
</TabItem>
<TabItem value="nodejs" label="NodeJS">
-Node 17.5 and 18.0 have native support for fetch:
+NodeJS releases starting from version 18.0 have native support for fetch:
```js
const XLSX = require("xlsx");
@@ -498,18 +498,18 @@ const workbook = XLSX.read(data);
Deno has native support for `fetch`.
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
/* load the codepage support library for extended support with older formats */
import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
XLSX.set_cptable(cptable);
-
+\n\
const url = "https://oss.sheetjs.com/test_files/formula_stress_test.xlsx";
// highlight-next-line
const data = await (await fetch(url)).arrayBuffer();
/* data is an ArrayBuffer */
-const workbook = XLSX.read(data);`}</code></pre>
+const workbook = XLSX.read(data);`}</CodeBlock>
:::note
@@ -643,21 +643,21 @@ For these streams, `std` provides a `readAll` method to collect data into a
`Uint8Array`. This example reads from a file using `Deno.open` and prints the
worksheet names array:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
-
+\n\
import { readAll } from "https://deno.land/std/streams/conversion.ts";
-
+\n\
/* Simple Deno.Reader from a file */
const file = await Deno.open("test.xlsx", {read: true});
-
+\n\
/* \`content\` will be a Uint8Array holding the full contents of the stream */
const content = await readAll(file);
-
+\n\
/* Since this is a Uint8Array, \`XLSX.read\` "just works" */
const wb = XLSX.read(content);
-console.log(wb.SheetNames);`}</code></pre>
+console.log(wb.SheetNames);`}</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/06-solutions/05-output.md b/docz/docs/06-solutions/05-output.md
index 906fba7..3c1d921 100644
--- a/docz/docs/06-solutions/05-output.md
+++ b/docz/docs/06-solutions/05-output.md
@@ -212,11 +212,11 @@ writeFile(workbook, "out.xlsb");
`writeFile` uses `Deno.writeFileSync` under the hood:
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
-
-XLSX.writeFile(workbook, "test.xlsx");`}</code></pre>
+\n\
+XLSX.writeFile(workbook, "test.xlsx");`}</CodeBlock>
:::note
@@ -338,9 +338,9 @@ res.end(buf);
Install the library with
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
Save the following script to `node.js` and run with `node node.js`:
@@ -540,7 +540,7 @@ req.send(formdata);
`XLSX.write` with `type: "buffer"` will generate a NodeJS `Buffer` which can be
used with standard NodeJS approaches for uploading data.
-Node 17.5 and 18.0 have native support for fetch:
+NodeJS releases starting from version 18.0 have native support for fetch:
```js
const XLSX = require("xlsx");
diff --git a/docz/docs/08-api/07-write-options.md b/docz/docs/08-api/07-write-options.md
index f8bd783..fd8e64a 100644
--- a/docz/docs/08-api/07-write-options.md
+++ b/docz/docs/08-api/07-write-options.md
@@ -7,6 +7,7 @@ title: Writing Files
import current from '/version.js';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
+import CodeBlock from '@theme/CodeBlock';
**`XLSX.write(wb, options)`**
@@ -106,9 +107,9 @@ Adding NUMBERS export support involves two steps:
<Tabs>
<TabItem value="browser" label="Browser">
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.zahl.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.zahl.js</a> is the URL for {current}</div>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.zahl.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.zahl.js</a> is the URL for {current}</p>
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<meta charset="utf8">\n\
<body>\n\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>\n\
@@ -122,16 +123,16 @@ var wb = XLSX.utils.book_new(); var ws = XLSX.utils.aoa_to_sheet([\n\
]); XLSX.utils.book_append_sheet(wb, ws, "Sheet1");\n\
XLSX.writeFile(wb, "textport.numbers", {numbers: XLSX_ZAHL_PAYLOAD, compression: true});\n\
</script>\n\
-</body>`}</code></pre>
+</body>`}</CodeBlock>
</TabItem>
<TabItem value="nodejs" label="NodeJS">
After installing the package:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
The scripts will be available at `xlsx/dist/xlsx.zahl` (CommonJS) and
`xlsx/dist/xlsx.zahl.mjs` (ESM).
@@ -153,9 +154,9 @@ XLSX.writeFile(wb, "textport.numbers", {numbers: XLSX_ZAHL_PAYLOAD, compression:
After installing the package:
-<pre><code parentName="pre" {...{"className": "language-bash"}}>{`\
+<CodeBlock language="bash">{`\
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
-</code></pre>
+</CodeBlock>
The scripts will be available at `xlsx/dist/xlsx.zahl` (CommonJS) and
`xlsx/dist/xlsx.zahl.mjs` (ESM).
@@ -177,12 +178,12 @@ XLSX.writeFile(wb, "textport.numbers", {numbers: XLSX_ZAHL_PAYLOAD, compression:
</TabItem>
<TabItem value="deno" label="Deno">
-<div><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.zahl.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.zahl.mjs</a> is the URL for {current}</div>
+<p><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.zahl.mjs`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.zahl.mjs</a> is the URL for {current}</p>
-<pre><code parentName="pre" {...{"className": "language-ts"}}>{`\
+<CodeBlock language="ts">{`\
import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';\n\
import XLSX_ZAHL_PAYLOAD from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.zahl.mjs';\n\
-
+\n\
var wb = XLSX.utils.book_new(); var ws = XLSX.utils.aoa_to_sheet([\n\
["SheetJS", "<3","விரிதாள்"],\n\
[72,,"Arbeitsblätter"],\n\
@@ -190,7 +191,7 @@ var wb = XLSX.utils.book_new(); var ws = XLSX.utils.aoa_to_sheet([\n\
[true,false,],\n\
]); XLSX.utils.book_append_sheet(wb, ws, "Sheet1");\n\
XLSX.writeFile(wb, "textport.numbers", {numbers: XLSX_ZAHL_PAYLOAD, compression: true});\n\
-`}</code></pre>
+`}</CodeBlock>
</TabItem>
</Tabs>
diff --git a/docz/docs/09-miscellany/02-errors.md b/docz/docs/09-miscellany/02-errors.md
index 315fba9..948db7d 100644
--- a/docz/docs/09-miscellany/02-errors.md
+++ b/docz/docs/09-miscellany/02-errors.md
@@ -5,6 +5,7 @@ hide_table_of_contents: true
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
Here are some common errors and their resolutions. This is not comprehensive.
The [issue tracker](https://git.sheetjs.com/SheetJS/sheetjs/issues) has a
@@ -263,11 +264,11 @@ that include more browser-specific workarounds.
_Standalone Build_
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script src="https://unpkg.com/file-saver@2.0.5/dist/FileSaver.js"></script>
-<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`}
-<!-- XLSX.writeFile will use the FileSaver `saveAs` implementation -->
-</code></pre>
+<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
+<!-- XLSX.writeFile will use the FileSaver \`saveAs\` implementation -->`}
+</CodeBlock>
_Frameworks and Bundlers_
diff --git a/docz/docs/09-miscellany/05-contributing.md b/docz/docs/09-miscellany/05-contributing.md
index bb30018..e380ae7 100644
--- a/docz/docs/09-miscellany/05-contributing.md
+++ b/docz/docs/09-miscellany/05-contributing.md
@@ -222,7 +222,7 @@ cd sheetjs
```bash
# Install dev dependencies
-npm install
+npm i
# Install global dependencies
sudo npm i -g mocha@2.5.3 voc @sheetjs/uglify-js
diff --git a/docz/docs/index.md b/docz/docs/index.md
index 2c1fd29..ab788a0 100644
--- a/docz/docs/index.md
+++ b/docz/docs/index.md
@@ -5,6 +5,7 @@ title: Overview
---
import current from '/version.js';
+import CodeBlock from '@theme/CodeBlock';
# SheetJS CE
@@ -34,9 +35,9 @@ run entirely in the web browser.
2) Include a reference to the SheetJS library in your page:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`}
-</code></pre>
+</CodeBlock>
3) Add a button that users will click to generate an export
@@ -113,9 +114,9 @@ support for CSS styling and rich text.
2) Include a reference to the SheetJS library in your page:
-<pre><code parentName="pre" {...{"className": "language-html"}}>{`\
+<CodeBlock language="html">{`\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`}
-</code></pre>
+</CodeBlock>
3) Add a script block to download and update the page:
diff --git a/docz/docusaurus.config.js b/docz/docusaurus.config.js
index 19e1c34..09976b1 100644
--- a/docz/docusaurus.config.js
+++ b/docz/docusaurus.config.js
@@ -142,7 +142,7 @@ const config = {
prism: {
theme: lightCodeTheme,
darkTheme: darkCodeTheme,
- additionalLanguages: [ "swift", "java", "csharp", "perl", "ruby", "cpp", "applescript" ],
+ additionalLanguages: [ "swift", "java", "csharp", "perl", "ruby", "cpp", "applescript", "liquid" ],
},
liveCodeBlock: {
playgroundPosition: 'top'
diff --git a/docz/src/theme/prism-include-languages.js b/docz/src/theme/prism-include-languages.js
new file mode 100644
index 0000000..12e76c8
--- /dev/null
+++ b/docz/src/theme/prism-include-languages.js
@@ -0,0 +1,25 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+ import siteConfig from '@generated/docusaurus.config';
+ export default function prismIncludeLanguages(PrismObject) {
+ const {
+ themeConfig: {prism},
+ } = siteConfig;
+ const {additionalLanguages} = prism;
+ // Prism components work on the Prism instance on the window, while prism-
+ // react-renderer uses its own Prism instance. We temporarily mount the
+ // instance onto window, import components to enhance it, then remove it to
+ // avoid polluting global namespace.
+ // You can mutate PrismObject: registering plugins, deleting languages... As
+ // long as you don't re-assign it
+ globalThis.Prism = PrismObject;
+ additionalLanguages.forEach((lang) => {
+ // eslint-disable-next-line global-require, import/no-dynamic-require
+ require(`prismjs/components/prism-${lang}`);
+ });
+ //delete globalThis.Prism; // <-- If this line is not commented, `liquid` will fail.
+}
diff --git a/docz/static/eleventy/_eleventy.js b/docz/static/eleventy/_eleventy.js
new file mode 100644
index 0000000..2594d3e
--- /dev/null
+++ b/docz/static/eleventy/_eleventy.js
@@ -0,0 +1,21 @@
+const XLSX = require("xlsx");
+
+/* list of file extensions */
+const exts = [ "numbers", "xlsx", "xlsb", "xls" ].join(", ");
+
+module.exports = (eleventyConfig) => {
+ eleventyConfig.addDataExtension(exts, {
+ /* read file and pass raw Buffer object to parser */
+ // highlight-next-line
+ encoding: null, read: true,
+
+ /* parser callback */
+ parser: (contents) => {
+ /* contents is the data stored as a Buffer */
+ // highlight-next-line
+ const wb = XLSX.read(contents);
+ /* generate array of row objects from first worksheet */
+ return XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
+ }
+ });
+};
diff --git a/docz/static/eleventy/index.njk b/docz/static/eleventy/index.njk
new file mode 100644
index 0000000..16892b4
--- /dev/null
+++ b/docz/static/eleventy/index.njk
@@ -0,0 +1,10 @@
+<table><thead><th>Name</th><th>Index</th></thead>
+ <tbody>
+ {% for row in pres %}
+ <tr>
+ <td>{{ row.Name }}</td>
+ <td>{{ row.Index }}</td>
+ </tr>
+ {% endfor %}
+ </tbody>
+</table>
\ No newline at end of file