eleventy
This commit is contained in:
parent
32021ab7ed
commit
8c754069bf
@ -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
|
||||
|
@ -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/`
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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
|
||||
|
||||
|
@ -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`:
|
||||
|
||||
|
@ -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
|
||||
|
||||
|
@ -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
|
||||
|
@ -192,34 +192,24 @@ worksheet["!cols"] = [ { wch: max_width } ];
|
||||
|
||||
</details>
|
||||
|
||||
After cleanup, the generated workbook looks like the screenshot below:
|
||||
|
||||
![Final export](pathname:///example/final.png)
|
||||
|
||||
## 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 });
|
||||
```
|
||||
|
||||
![Final export](pathname:///example/final.png)
|
||||
|
||||
|
||||
## 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>
|
||||
|
||||
|
@ -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`)
|
||||
|
||||
|
@ -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`)
|
||||
|
||||
|
@ -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
|
||||
|
||||
|
@ -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`)
|
||||
|
||||
|
@ -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< |