error notes

This commit is contained in:
SheetJS 2025-02-10 02:13:57 -05:00
parent 2945596391
commit d3e0baa6bb
9 changed files with 144 additions and 58 deletions

@ -36,10 +36,11 @@ This demo was tested in the following configurations:
| Platform | Architecture | Date |
|:------------------------------------------------------------------|:-------------|:-----------|
| NVIDIA RTX 4090 (24 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | 2025-01-08 |
| NVIDIA RTX 4080 SUPER (16 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | 2025-01-12 |
| NVIDIA RTX 4090 (24 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `linux-x64` | 2025-01-28 |
| AMD RX 7900 XTX (24 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | 2025-01-12 |
| AMD RX 6800 XT (16 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | 2025-01-12 |
| AMD RX 7900 XTX (24 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `linux-x64` | 2025-01-29 |
| Intel Arc B580 (12 GB VRAM) + Ryzen Z1 Extreme (24 GB RAM) | `win11-x64` | 2025-01-24 |
| Intel Arc B580 (12 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `linux-x64` | 2025-02-08 |
| Apple M2 Max 12-Core CPU + 30-Core GPU (32 GB unified memory) | `darwin-arm` | 2024-11-04 |
SheetJS users have verified this demo in other configurations:
@ -47,20 +48,23 @@ SheetJS users have verified this demo in other configurations:
<details>
<summary><b>Other tested configurations</b> (click to show)</summary>
| Platform | Architecture | Demo |
|:------------------------------------------------------------|:-------------|:------------|
| NVIDIA L40 (48 GB VRAM) + i9-13900K (32 GB RAM) | `linux-x64` | LangChainJS |
| NVIDIA RTX 4070 Ti (12 GB VRAM) + Ryzen 7 5800x (64 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 4060 (8 GB VRAM) + Ryzen 7 5700g (32 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3090 (24 GB VRAM) + Ryzen 9 3900XT (128 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3080 (12 GB VRAM) + Ryzen 7 5800X (32 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3070 (8 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3060 (12 GB VRAM) + i5-11400 (32 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA RTX 2080 (12 GB VRAM) + i7-9700K (16 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA RTX 2070 (8 GB VRAM) + Ryzen 7 3700x (80 GB RAM) | `linux-x64` | LangChainJS |
| NVIDIA RTX 2060 (6 GB VRAM) + Ryzen 5 3600 (32 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA GTX 1080 (8 GB VRAM) + Ryzen 7 5800x (64 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA GTX 1070 (8 GB VRAM) + Ryzen 7 7700x (32 GB RAM) | `win11-x64` | LangChainJS |
| Platform | Architecture | Demo |
|:------------------------------------------------------------------|:-------------|:------------|
| NVIDIA L40 (48 GB VRAM) + i9-13900K (32 GB RAM) | `linux-x64` | LangChainJS |
| NVIDIA RTX 4080 SUPER (16 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 4070 Ti (12 GB VRAM) + Ryzen 7 5800x (64 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 4060 (8 GB VRAM) + Ryzen 7 5700g (32 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3090 (24 GB VRAM) + Ryzen 9 3900XT (128 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3080 (12 GB VRAM) + Ryzen 7 5800X (32 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3070 (8 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | LangChainJS |
| NVIDIA RTX 3060 (12 GB VRAM) + i5-11400 (32 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA RTX 2080 (12 GB VRAM) + i7-9700K (16 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA RTX 2070 (8 GB VRAM) + Ryzen 7 3700x (80 GB RAM) | `linux-x64` | LangChainJS |
| NVIDIA RTX 2060 (6 GB VRAM) + Ryzen 5 3600 (32 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA GTX 1080 (8 GB VRAM) + Ryzen 7 5800x (64 GB RAM) | `win10-x64` | LangChainJS |
| NVIDIA GTX 1070 (8 GB VRAM) + Ryzen 7 7700x (32 GB RAM) | `win11-x64` | LangChainJS |
| AMD RX 6800 XT (16 GB VRAM) + Ryzen Z1 Extreme (16 GB RAM) | `win11-x64` | LangChainJS |
| Apple M4 10-Core CPU + 10-Core GPU (24 GB unified memory) | `darwin-arm` | LangChainJS |
</details>

@ -72,7 +72,7 @@ UI5 is typically loaded in a `SCRIPT` tag in `webapp/index.html`. Similarly,
[SheetJS Standalone scripts](/docs/getting-started/installation/standalone)
can be loaded with a `SCRIPT` tag in the same HTML page:
<CodeBlock language="html" value="html">{`\
<CodeBlock language="html" value="html" title="index.html (add in the HEAD block before UI5 scripts)">{`\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
`}
</CodeBlock>
@ -434,7 +434,7 @@ SAP recommends `npm run build`. This does not generate a proper standalone site!
Sites built with `npm run build` must be served with `npm run start:dist`.
This demo uses the `build:opt` target to ensure that a proper static site is
generated. The `dist` folder in this demo can be posted
generated. The `dist` folder in this demo can be deployed on a static host.
:::
@ -604,7 +604,7 @@ SAP recommends `npm run build`. This does not generate a proper standalone site!
Sites built with `npm run build` must be served with `npm run start:dist`.
This demo uses the `build:opt` target to ensure that a proper static site is
generated. The `dist` folder in this demo can be posted
generated. The `dist` folder in this demo can be deployed on a static host.
:::

@ -1,5 +1,6 @@
---
title: Oracle Cloud Services
title: Oracle Cloud Infrastructure
sidebar_label: Oracle Cloud
pagination_prev: demos/local/index
pagination_next: demos/extensions/index
---
@ -7,22 +8,23 @@ pagination_next: demos/extensions/index
import current from '/version.js';
import CodeBlock from '@theme/CodeBlock';
[Oracle Cloud Services](https://www.oracle.com/cloud/) (OCI) is a cloud services
platform which includes traditional virtual machine support, "Serverless
Functions" and cloud storage.
[Oracle Cloud Infrastructure](https://www.oracle.com/cloud/) (OCI) is a cloud
services platform for building and deploying line of business applications.
[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
data from spreadsheets.
This demo demonstrates how to integrate SheetJS with Oracle `Visual Builder Studio (VBS)`[^2]
to build a web application that handles Excel files. You'll learn to create an application
that can import spreadsheet data, store it in `Business Objects`[^1], display it in a table, and
export it back to Excel format.
This demo explores the "Visual Builder Studio" (VBS) environment[^1]. We'll use
VBS and SheetJS to build a web application that handles Excel files.
In the ["Complete Example"](#complete-example), we'll create an application that
imports data from spreadsheet, stores data in "Business Objects"[^2], displays
data in table components, and exports Business Objects to new spreadsheets.
:::caution pass
Oracle Cloud Services iterates quickly and there is no guarantee that the referenced services
will be available in the future.
Oracle Cloud Infrastructure iterates quickly and there is no guarantee that the
referenced services will be available in the future.
:::
@ -32,41 +34,84 @@ This demo was last tested on 2025-02-04.
:::
## Visual Applications
Oracle Cloud Services offers Visual Builder Studio a browser-based development environment for
creating web applications with drag-and-drop components.
"Visual Builder Studio", a core Oracle Cloud Infrastructure offering, is a
browser-based development environment for creating web applications with
drag-and-drop components.
## Installation
SheetJS libraries conform to the Oracle Cloud Visual Builder Studio (VBS) ECMAScript[^5] requirements.
SheetJS libraries can be loaded in Oracle VBS site at different points in the app lifecycle.
### Installation
#### Configure in app-flow.json
SheetJS libraries conform to Visual Builder Studio ECMAScript[^5] requirements.
They can be loaded in VBS applications at different points in the app lifecycle.
The `app-flow.json` method is recommended as it aligns better with Visual Builder Studio's
module management system.
#### RequireJS Module {#installation-define}
1. Click 📄 `Source` from the left sidebar
2. Open `webApps/sheetjs_demo_app/app-flow.json`
3. Add the following configuration after line 5:
The [SheetJS Standalone scripts](/docs/getting-started/installation/standalone)
comply with AMD `define` semantics. They support `define` out of the box.
<CodeBlock language="json" value="json">{`\
"requirejs": {
*Module Alias*
Unlike other platforms, Oracle Visual Builder `define` requires module aliases.
Aliases are stored in `app-flow.json`. SheetJS scripts are designed to use the
`xlsx` alias.
An alias can be added in Visual Builder Studio with the following steps:
1. Click 📄 `Source` from the left sidebar.
2. Expand the `webApps` folder.
3. Expand the subfolder whose name matches the "Application Name" for the site.
4. Open `app-flow.json` within the folder from step 3.
5. Add the following lines after line 5:
<CodeBlock language="json" value="json" title="app-flow.json (add after line 5)">{`\
"requirejs": {
"paths": {
"xlsx": "https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"
"xlsx": "https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min"
}
}
},
`}
</CodeBlock>
*Script Reference*
After defining the alias, action chains can load the module using `define`:
```js title="Action Chain Code (loading the SheetJS dependency)"
define([
// highlight-next-line
"xlsx",
/* ... other libraries ... */
'vb/action/actionChain', 'vb/action/actions'
], (
// highlight-next-line
XLSX,
/* ... variables for the other libraries ... */
ActionChain, Actions
) => {
class MyActionChain extends ActionChain {
async run(context) {
// highlight-next-line
console.log(XLSX.version); // use XLSX in the callback
}
/* ... other methods ... */
}
return MyActionChain;
});
```
#### HTML {#installation-html}
Oracle Cloud VBS is typically loaded in `SCRIPT` tag in `webApps/sheetjs_demo_app/index.html`. Similarly,
[SheetJS Standalone scripts](/docs/getting-started/installation/standalone)
can be loaded with a `SCRIPT` tag in the same HTML page:
[SheetJS Standalone scripts](/docs/getting-started/installation/standalone) can
be loaded with a `SCRIPT` tag in the `index.html` entry page for the app.
Typically this file is stored in the app folder.
<CodeBlock language="html" value="html">{`\
For example, if the app is named `sheetjs_demo_app`, the entrypoint HTML file is
`webApps/sheetjs_demo_app/index.html`.
The script should be added before the Oracle JET and VB scripts:
<CodeBlock language="html" value="html" title="index.html (add in the HEAD block before Oracle scripts)">{`\
<script src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>
`}
</CodeBlock>
@ -83,7 +128,9 @@ depends on the application.
### Business Objects
`Business Objects`[^1] in Oracle VBS provides a server-side model implementation for persistent data storage.
`Business Objects`[^2] in Oracle VBS provides a server-side model implementation
for persistent data storage.
Think of them as a combination of a data model and database table that handles both data storage and
UI binding.
@ -140,7 +187,7 @@ Starting from a spreadsheet file, the SheetJS [`read`](/docs/api/parse-options)
selecting a worksheet, [`sheet_to_json`](/docs/api/utilities/array#array-output) generates row objects that can be created as Business Object
records using the auto-generated REST API.
Here is a sample flow diagram and method for downloading a workbook, generating rows from the first worksheet, and updating a `Business Object`[^1]:
Here is a sample flow diagram and method for downloading a workbook, generating rows from the first worksheet, and updating a `Business Object`[^2]:
```mermaid
flowchart LR
@ -386,7 +433,7 @@ define([
});
```
## Oracle Visual Builder Studio Web Applications Demo
## Complete Example
:::note pass
@ -534,8 +581,8 @@ Visual Builder Studio access.
- Open the downloaded file using a spreadsheet editor.
- Verify that the exported data matches what was displayed in your application's table
[^1]: See Oracle VBS working with [Business Objects](https://docs.oracle.com/en/cloud/paas/visual-builder/visualbuilder-building-applications/working-business-objects1.html) for more detail.
[^2]: [Oracle Visual Builder Studio](https://docs.oracle.com/en/cloud/paas/visual-builder/)
[^1]: See ["Oracle Visual Builder Studio"](https://docs.oracle.com/en/cloud/paas/visual-builder/) in the Oracle Cloud documentation.
[^2]: See ["Work With Business Objects"](https://docs.oracle.com/en/cloud/paas/visual-builder/visualbuilder-building-applications/working-business-objects1.html) in the Oracle Visual Build Studio documentation.
[^3]: Registering for a free account [on the Oracle Cloud Free Tier](https://www.oracle.com/cloud/free/) requires a valid phone number and a valid credit card.
[^4]: See [Oracle VBS Table Component](https://docs.oracle.com/en/middleware/developer-tools/jet/13/reference-api/oj.ojTable.html) for more details.
[^5]: See ["JavaScript Support in Oracle VBS"](https://docs.oracle.com/en/cloud/paas/visual-builder/visualbuilder-building-applications/work-javascript-editor1.html?utm_source=chatgpt.com) for more details on custom JavaScript functionality and module handling.

@ -25,8 +25,9 @@ HTML format and HTML table utilities.
var html = XLSX.utils.sheet_to_html(ws, opts);
```
As an alternative to the `writeFile` HTML type, `XLSX.utils.sheet_to_html` also
produces HTML output. The function takes an options argument:
The `sheet_to_html` method generates HTML strings from SheetJS worksheets[^1].
The following options are supported:
| Option Name | Default | Description |
|:------------|:--------:|:----------------------------------------------------|
@ -35,7 +36,8 @@ produces HTML output. The function takes an options argument:
| `header` | | Override header |
| `footer` | | Override footer |
Starting from [the sample file `pres.numbers`](https://docs.sheetjs.com/pres.numbers):
This example fetches [`pres.numbers`](https://docs.sheetjs.com/pres.numbers) and
generates an HTML TABLE from the contents of the first worksheet:
```jsx live
function SheetJSHTML() {
@ -59,6 +61,14 @@ function SheetJSHTML() {
}
```
:::note pass
The SheetJS [`write` and `writeFile` methods](/docs/api/write-options) generate
HTML when the option `bookType: "html"` is specified. They use `sheet_to_html`
under the hood.
:::
### Implementation Details
The generated table will include special data attributes on each `TD` element:
@ -451,3 +461,5 @@ browser. ["Browser Automation"](/docs/demos/net/headless) covers some browsers.
Some ecosystems provide DOM-like frameworks that are compatible with SheetJS.
Examples are included in the ["Synthetic DOM"](/docs/demos/net/dom) demo
[^1]: See ["Worksheet Object" in "SheetJS Data Model"](/docs/csf/sheet) for more details.

@ -26,8 +26,31 @@ workarounds and solutions!
:::
## Installation Issues
#### NodeJS / NPM Timeouts
Errors include
<CodeBlock language="text">{`\
WARN GET https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz error (ERR_SOCKET_TIMEOUT). Will retry in 10 seconds. 2 retries left.`}
</CodeBlock>
The [SheetJS NodeJS module](/docs/getting-started/installation/nodejs) can be
[vendored](/docs/getting-started/installation/nodejs#vendoring) in projects.
Vendoring completely decouples projects from the SheetJS CDN.
If the [SheetJS CDN](https://cdn.sheetjs.com) is not accessible, modules can be
delivered over the [SheetJS Chat](https://sheetjs.com/chat)
## Errors
#### No data in worksheets
[See issue 3273](https://git.sheetjs.com/sheetjs/sheetjs/issues/3273) for more
context. This is a web browser bug affecting Google Chrome, Microsoft Edge, and
other browsers that use the V8 JavaScript engine.
#### Uncaught TypeError: Cannot read property of undefined
Errors include

@ -44,7 +44,7 @@ These instructions were tested on the following platforms:
| Linux (Steam Deck Holo x64) | `linux-x64` | 2025-01-10 |
| Linux (Debian Linux AArch64) | `linux-arm` | 2025-01-14 |
| MacOS 14.4 (x64) | `darwin-x64` | 2024-07-12 |
| MacOS 15.1 (ARM64) | `darwin-arm` | 2024-11-10 |
| MacOS 15.2 (ARM64) | `darwin-arm` | 2025-01-27 |
| Windows 10 (x64) + WSL Ubuntu | `win10-x64` | 2024-07-12 |
| Windows 11 (x64) + WSL Ubuntu | `win11-x64` | 2025-01-14 |
| Windows 11 (ARM) + WSL Ubuntu | `win11-arm` | 2024-05-23 |

Binary file not shown.

After

Width:  |  Height:  |  Size: 185 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB