From b1dca24a0bd363f44681b009e4979f271e490574 Mon Sep 17 00:00:00 2001 From: SheetJS Date: Tue, 12 Apr 2022 07:59:15 -0400 Subject: [PATCH] next.js demo refresh [ci skip] --- README.md | 63 ++++++++++++-------- demos/README.md | 5 +- demos/deno/README.md | 12 ++-- demos/deno/sheet2csv.ts | 6 +- demos/deno/x.ts | 4 +- demos/headless/phantomjs.js | 2 +- demos/react/Makefile | 3 - demos/react/README.md | 76 ++++++++++++++++++++++-- demos/react/nexthdr.js | 4 +- demos/react/pages/.gitignore | 1 - demos/react/pages/getServerSideProps.js | 32 ++++++++++ demos/react/pages/getStaticPaths.js | 38 ++++++++++++ demos/react/pages/getStaticProps.js | 32 ++++++++++ demos/react/pages/index.js | 43 +++++++------- demos/react/pages/sheets/[id].js | 51 ++++++++++++++++ demos/react/public/sheetjs.xlsx | Bin 0 -> 10328 bytes demos/react/react-native.js | 2 +- demos/server/drash.ts | 6 +- docbits/10_install.md | 49 +++++++++------ docbits/13_usage.md | 2 +- docbits/16_demos.md | 4 +- docbits/22_ingress.md | 6 +- docbits/32_egress.md | 2 +- misc/docs/README.md | 61 ++++++++++++------- 24 files changed, 383 insertions(+), 121 deletions(-) delete mode 100644 demos/react/pages/.gitignore create mode 100644 demos/react/pages/getServerSideProps.js create mode 100644 demos/react/pages/getStaticPaths.js create mode 100644 demos/react/pages/getStaticProps.js create mode 100644 demos/react/pages/sheets/[id].js create mode 100644 demos/react/public/sheetjs.xlsx diff --git a/README.md b/README.md index 02b3a75..504cebf 100644 --- a/README.md +++ b/README.md @@ -125,19 +125,19 @@ can be directly added to a page with a `script` tag: ``` -
- CDN Availability (click to show) - -| CDN | URL | -|-----------:|:-------------------------------------------| -| `unpkg` | | -| `jsDelivr` | | -| `CDNjs` | | - -For example, `unpkg` makes the latest version available at: +Each standalone release script is available at . The +latest version uses the `latest` tag: ```html - + + +``` + +A specific release can be referenced by version: + +```html + + ```
@@ -154,6 +154,13 @@ A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build: - no support for XLSB / XLS / Lotus 1-2-3 / SpreadsheetML 2003 / Numbers - node stream utils removed +These scripts are also available on the CDN: + +```html + + +``` + @@ -193,23 +200,31 @@ set_cptable(cptable); **Deno** -`xlsx.mjs` can be imported in Deno. It is available from `unpkg`: +`xlsx.mjs` can be imported in Deno: ```ts -// @deno-types="https://unpkg.com/xlsx/types/index.d.ts" -import * as XLSX from 'https://unpkg.com/xlsx/xlsx.mjs'; +// @deno-types="https://cdn.sheetjs.com/xlsx-latest/package/types/index.d.ts" +import * as XLSX from 'https://cdn.sheetjs.com/xlsx-latest/package/xlsx.mjs'; /* load the codepage support library for extended support with older formats */ -import * as cptable from 'https://unpkg.com/xlsx/dist/cpexcel.full.mjs'; +import * as cptable from 'https://cdn.sheetjs.com/xlsx-latest/package/dist/cpexcel.full.mjs'; XLSX.set_cptable(cptable); ``` **NodeJS** -With [npm](https://www.npmjs.org/package/xlsx): +Modules are available on [the public npm registry](https://www.npmjs.org/package/xlsx): ```bash -$ npm install xlsx +$ pnpm install xlsx # using pnpm +$ yarn add xlsx # using yarn +$ npm install xlsx # using npm +``` + +Tarballs are also available on : + +```bash +$ npm install https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz ``` By default, the module supports `require`: @@ -519,7 +534,7 @@ For use in the web browser, assuming the snippet is saved to `snippet.js`, script tags should be used to include the `axios` and `xlsx` standalone builds: ```html - + ``` @@ -548,8 +563,8 @@ The [`demos` directory](demos/) includes sample projects for: - [`angular and ionic`](demos/angular2/) - [`knockout`](demos/knockout/) - [`meteor`](demos/meteor/) -- [`react and react-native`](demos/react/) -- [`vue 2.x and weex`](demos/vue/) +- [`react, react-native, next`](demos/react/) +- [`vue 2.x, weex, nuxt`](demos/vue/) - [`XMLHttpRequest and fetch`](demos/xhr/) - [`nodejs server`](demos/server/) - [`databases and key/value stores`](demos/database/) @@ -1186,8 +1201,8 @@ Here are a few common scenarios (click on each subtitle to see the code): ```html - - + + @@ -1333,7 +1348,7 @@ var code = [ "function(){", page.open('https://sheetjs.com/demos/table', function() { /* Load the browser script from the UNPKG CDN */ - page.includeJs("https://unpkg.com/xlsx/dist/xlsx.full.min.js", function() { + page.includeJs("https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js", function() { /* The code will return an XLSB file encoded as binary string */ var bin = page.evaluateJavaScript(code); @@ -1992,7 +2007,7 @@ Combining with `fetch`, constructing a site from a workbook is straightforward:
- + + + + 
+
SheetJS Next.JS {type} Demo

+This demo reads from /public/sheetjs.xlsx and generates HTML from the first sheet.
+
+
+
+); } + +export async function getServerSideProps() { + const wb = readFile(join(cwd(), "public", "sheetjs.xlsx")) + return { + props: { + type: "getStaticProps", + html: utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]), + }, + } +} \ No newline at end of file diff --git a/demos/react/pages/getStaticPaths.js b/demos/react/pages/getStaticPaths.js new file mode 100644 index 0000000..3852295 --- /dev/null +++ b/demos/react/pages/getStaticPaths.js @@ -0,0 +1,38 @@ +import Head from 'next/head'; +import Link from "next/link"; +import { readFile, utils } from 'xlsx'; +import { join } from 'path'; +import { cwd } from 'process'; + +export default function Index({snames, type}) { return ( +
+ + + SheetJS Next.JS {type} Demo + + + + 
+
SheetJS Next.JS {type} Demo

+This demo reads from /public/sheetjs.xlsx.  Each worksheet maps to a path:


+{snames.map((sname, idx) => (<>
+  {`Sheet index=${idx} name="${sname}"`}
+  

+  

+))}
+
+
+
+); } + +export async function getStaticProps() { + const wb = readFile(join(cwd(), "public", "sheetjs.xlsx")) + return { + props: { + type: "getStaticPaths", + snames: wb.SheetNames, + }, + } +} \ No newline at end of file diff --git a/demos/react/pages/getStaticProps.js b/demos/react/pages/getStaticProps.js new file mode 100644 index 0000000..ca2e304 --- /dev/null +++ b/demos/react/pages/getStaticProps.js @@ -0,0 +1,32 @@ +import Head from 'next/head'; +import { readFile, utils } from 'xlsx'; +import { join } from 'path'; +import { cwd } from 'process'; + +export default function Index({html, type}) { return ( +
+ + + SheetJS Next.JS {type} Demo + + + + 
+
SheetJS Next.JS {type} Demo

+This demo reads from /public/sheetjs.xlsx and generates HTML from the first sheet.
+
+
+
+); } + +export async function getStaticProps() { + const wb = readFile(join(cwd(), "public", "sheetjs.xlsx")) + return { + props: { + type: "getStaticProps", + html: utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]), + }, + } +} \ No newline at end of file diff --git a/demos/react/pages/index.js b/demos/react/pages/index.js index ce781fd..c93bccd 100644 --- a/demos/react/pages/index.js +++ b/demos/react/pages/index.js @@ -1,23 +1,24 @@ -import Head from 'next/head' -import SheetJSApp from './sheetjs' -const Index = () => ( +import Head from 'next/head'; + +export default function Index() { return (
- - - SheetJS React Demo - - - - -
-

SheetJS React Demo

-
- Source Code Repo
- Issues? Something look weird? Click here and report an issue

-
- + + + SheetJS Next.JS Demo + + + + 
+
SheetJS Next.JS Demos

+All demos read from /public/sheetjs.xlsx.

+

+- getStaticProps

+

+- getServerSideProps

+

+- getStaticPaths

+
-); -export default Index; \ No newline at end of file +); } \ No newline at end of file diff --git a/demos/react/pages/sheets/[id].js b/demos/react/pages/sheets/[id].js new file mode 100644 index 0000000..530b675 --- /dev/null +++ b/demos/react/pages/sheets/[id].js @@ -0,0 +1,51 @@ +import Head from 'next/head'; +import { readFile, utils } from 'xlsx'; +import { join } from 'path'; +import { cwd } from 'process'; + +export default function Index({html, type, name}) { return ( +
+ + + SheetJS Next.JS {type} Demo + + + + 
+
SheetJS Next.JS {type} Demo

+This demo reads from /public/sheetjs.xlsx.

+

+{name}
+
+
+
+); } + +let cache = []; + +export async function getStaticProps(ctx) { + if(!cache || !cache.length) { + const wb = readFile(join(cwd(), "public", "sheetjs.xlsx")); + cache = wb.SheetNames.map((name) => ({ name, sheet: wb.Sheets[name] })); + } + const entry = cache[ctx.params.id]; + return { + props: { + type: "getStaticPaths", + name: entry.name, + id: ctx.params.id.toString(), + html: entry.sheet ? utils.sheet_to_html(entry.sheet) : "", + }, + } +} + +export async function getStaticPaths() { + const wb = readFile(join(cwd(), "public", "sheetjs.xlsx")); + cache = wb.SheetNames.map((name) => ({ name, sheet: wb.Sheets[name] })); + return { + paths: wb.SheetNames.map((name, idx) => ({ params: { id: idx.toString() } })), + fallback: false, + }; +} diff --git a/demos/react/public/sheetjs.xlsx b/demos/react/public/sheetjs.xlsx new file mode 100644 index 0000000000000000000000000000000000000000..25496b9bf02e58b00d3610e257610798bf251d21 GIT binary patch literal 10328 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 UEDV@w007d@ADFD%)Ib0IA7+oOumAu6 literal 0 HcmV?d00001 diff --git a/demos/react/react-native.js b/demos/react/react-native.js index c29eae6..2c11a98 100644 --- a/demos/react/react-native.js +++ b/demos/react/react-native.js @@ -1,5 +1,5 @@ /* xlsx.js (C) 2013-present SheetJS -- http://sheetjs.com */ -import XLSX from 'xlsx'; +import * as XLSX from 'xlsx'; import React, { Component } from 'react'; import { AppRegistry, diff --git a/demos/server/drash.ts b/demos/server/drash.ts index 3ff0e9e..5446b66 100644 --- a/demos/server/drash.ts +++ b/demos/server/drash.ts @@ -1,7 +1,7 @@ /*! sheetjs (C) 2013-present SheetJS -- http://sheetjs.com */ -// @deno-types="https://unpkg.com/xlsx/types/index.d.ts" -import { read, utils, set_cptable } from 'https://unpkg.com/xlsx/xlsx.mjs'; -import * as cptable from 'https://unpkg.com/xlsx/dist/cpexcel.full.mjs'; +// @deno-types="https://cdn.sheetjs.com/xlsx-latest/package/types/index.d.ts" +import { read, utils, set_cptable } from 'https://cdn.sheetjs.com/xlsx-latest/package/xlsx.mjs'; +import * as cptable from 'https://cdn.sheetjs.com/xlsx-latest/package/dist/cpexcel.full.mjs'; set_cptable(cptable); import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts"; diff --git a/docbits/10_install.md b/docbits/10_install.md index 6ae7918..41d374d 100644 --- a/docbits/10_install.md +++ b/docbits/10_install.md @@ -11,19 +11,19 @@ can be directly added to a page with a `script` tag: ``` -
- CDN Availability (click to show) - -| CDN | URL | -|-----------:|:-------------------------------------------| -| `unpkg` | | -| `jsDelivr` | | -| `CDNjs` | | - -For example, `unpkg` makes the latest version available at: +Each standalone release script is available at . The +latest version uses the `latest` tag: ```html - + + +``` + +A specific release can be referenced by version: + +```html + + ```
@@ -40,6 +40,13 @@ A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build: - no support for XLSB / XLS / Lotus 1-2-3 / SpreadsheetML 2003 / Numbers - node stream utils removed +These scripts are also available on the CDN: + +```html + + +``` + @@ -79,23 +86,31 @@ set_cptable(cptable); **Deno** -`xlsx.mjs` can be imported in Deno. It is available from `unpkg`: +`xlsx.mjs` can be imported in Deno: ```ts -// @deno-types="https://unpkg.com/xlsx/types/index.d.ts" -import * as XLSX from 'https://unpkg.com/xlsx/xlsx.mjs'; +// @deno-types="https://cdn.sheetjs.com/xlsx-latest/package/types/index.d.ts" +import * as XLSX from 'https://cdn.sheetjs.com/xlsx-latest/package/xlsx.mjs'; /* load the codepage support library for extended support with older formats */ -import * as cptable from 'https://unpkg.com/xlsx/dist/cpexcel.full.mjs'; +import * as cptable from 'https://cdn.sheetjs.com/xlsx-latest/package/dist/cpexcel.full.mjs'; XLSX.set_cptable(cptable); ``` **NodeJS** -With [npm](https://www.npmjs.org/package/xlsx): +Modules are available on [the public npm registry](https://www.npmjs.org/package/xlsx): ```bash -$ npm install xlsx +$ pnpm install xlsx # using pnpm +$ yarn add xlsx # using yarn +$ npm install xlsx # using npm +``` + +Tarballs are also available on : + +```bash +$ npm install https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz ``` By default, the module supports `require`: diff --git a/docbits/13_usage.md b/docbits/13_usage.md index f6d866e..4e89c14 100644 --- a/docbits/13_usage.md +++ b/docbits/13_usage.md @@ -248,7 +248,7 @@ For use in the web browser, assuming the snippet is saved to `snippet.js`, script tags should be used to include the `axios` and `xlsx` standalone builds: ```html - + ``` diff --git a/docbits/16_demos.md b/docbits/16_demos.md index 44ecf89..43e7ba1 100644 --- a/docbits/16_demos.md +++ b/docbits/16_demos.md @@ -7,8 +7,8 @@ The [`demos` directory](demos/) includes sample projects for: - [`angular and ionic`](demos/angular2/) - [`knockout`](demos/knockout/) - [`meteor`](demos/meteor/) -- [`react and react-native`](demos/react/) -- [`vue 2.x and weex`](demos/vue/) +- [`react, react-native, next`](demos/react/) +- [`vue 2.x, weex, nuxt`](demos/vue/) - [`XMLHttpRequest and fetch`](demos/xhr/) - [`nodejs server`](demos/server/) - [`databases and key/value stores`](demos/database/) diff --git a/docbits/22_ingress.md b/docbits/22_ingress.md index f5edbf9..0b58a00 100644 --- a/docbits/22_ingress.md +++ b/docbits/22_ingress.md @@ -152,8 +152,8 @@ Here are a few common scenarios (click on each subtitle to see the code): ```html - - + +
@@ -299,7 +299,7 @@ var code = [ "function(){", page.open('https://sheetjs.com/demos/table', function() { /* Load the browser script from the UNPKG CDN */ - page.includeJs("https://unpkg.com/xlsx/dist/xlsx.full.min.js", function() { + page.includeJs("https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js", function() { /* The code will return an XLSB file encoded as binary string */ var bin = page.evaluateJavaScript(code); diff --git a/docbits/32_egress.md b/docbits/32_egress.md index 3189914..37ea3dc 100644 --- a/docbits/32_egress.md +++ b/docbits/32_egress.md @@ -169,7 +169,7 @@ Combining with `fetch`, constructing a site from a workbook is straightforward:
- + ``` - -| CDN | URL | -|-----------:|:-------------------------------------------| -| `unpkg` | | -| `jsDelivr` | | -| `CDNjs` | | - -For example, `unpkg` makes the latest version available at: +Each standalone release script is available at . The +latest version uses the `latest` tag: ```html - + + +``` + +A specific release can be referenced by version: + +```html + + ``` @@ -146,6 +148,13 @@ A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build: - no support for XLSB / XLS / Lotus 1-2-3 / SpreadsheetML 2003 / Numbers - node stream utils removed +These scripts are also available on the CDN: + +```html + + +``` + With [bower](https://bower.io/search/?q=js-xlsx): @@ -184,23 +193,31 @@ set_cptable(cptable); **Deno** -`xlsx.mjs` can be imported in Deno. It is available from `unpkg`: +`xlsx.mjs` can be imported in Deno: ```ts -// @deno-types="https://unpkg.com/xlsx/types/index.d.ts" -import * as XLSX from 'https://unpkg.com/xlsx/xlsx.mjs'; +// @deno-types="https://cdn.sheetjs.com/xlsx-latest/package/types/index.d.ts" +import * as XLSX from 'https://cdn.sheetjs.com/xlsx-latest/package/xlsx.mjs'; /* load the codepage support library for extended support with older formats */ -import * as cptable from 'https://unpkg.com/xlsx/dist/cpexcel.full.mjs'; +import * as cptable from 'https://cdn.sheetjs.com/xlsx-latest/package/dist/cpexcel.full.mjs'; XLSX.set_cptable(cptable); ``` **NodeJS** -With [npm](https://www.npmjs.org/package/xlsx): +Modules are available on [the public npm registry](https://www.npmjs.org/package/xlsx): ```bash -$ npm install xlsx +$ pnpm install xlsx # using pnpm +$ yarn add xlsx # using yarn +$ npm install xlsx # using npm +``` + +Tarballs are also available on : + +```bash +$ npm install https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz ``` By default, the module supports `require`: @@ -505,7 +522,7 @@ For use in the web browser, assuming the snippet is saved to `snippet.js`, script tags should be used to include the `axios` and `xlsx` standalone builds: ```html - + ``` @@ -533,8 +550,8 @@ The [`demos` directory](demos/) includes sample projects for: - [`angular and ionic`](demos/angular2/) - [`knockout`](demos/knockout/) - [`meteor`](demos/meteor/) -- [`react and react-native`](demos/react/) -- [`vue 2.x and weex`](demos/vue/) +- [`react, react-native, next`](demos/react/) +- [`vue 2.x, weex, nuxt`](demos/vue/) - [`XMLHttpRequest and fetch`](demos/xhr/) - [`nodejs server`](demos/server/) - [`databases and key/value stores`](demos/database/) @@ -1124,8 +1141,8 @@ Here are a few common scenarios (click on each subtitle to see the code): ```html - - + +
@@ -1262,7 +1279,7 @@ var code = [ "function(){", page.open('https://sheetjs.com/demos/table', function() { /* Load the browser script from the UNPKG CDN */ - page.includeJs("https://unpkg.com/xlsx/dist/xlsx.full.min.js", function() { + page.includeJs("https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js", function() { /* The code will return an XLSB file encoded as binary string */ var bin = page.evaluateJavaScript(code); @@ -1867,7 +1884,7 @@ Combining with `fetch`, constructing a site from a workbook is straightforward:
- +