2022-05-16 03:26:04 +00:00
|
|
|
# SheetJS CE Docs
|
2022-05-11 21:03:03 +00:00
|
|
|
|
2022-05-16 03:26:04 +00:00
|
|
|
Hosted URL: <https://docs.sheetjs.com>
|
2022-08-26 19:21:53 +00:00
|
|
|
|
|
|
|
|
## Development
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
The site source code is in the `docz` folder. `make` builds the static site and
|
|
|
|
|
moves the generated pages and scripts to the `docs` folder.
|
|
|
|
|
|
2022-08-26 19:21:53 +00:00
|
|
|
`docz/version.js` exports a version number for use in docs pages.
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
### Build Commands
|
2022-08-26 19:21:53 +00:00
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
$ make init # install dependencies
|
|
|
|
|
$ make # build static site
|
|
|
|
|
$ make serve # serve static site
|
|
|
|
|
|
|
|
|
|
$ make dev # run dev server
|
|
|
|
|
$ make spell # spell check (.spelling custom dictionary)
|
|
|
|
|
$ make graph # build format graph and legend
|
|
|
|
|
```
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
### Formats Graph
|
2022-08-26 19:21:53 +00:00
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
The formats graph and legend are written in the DOT language. Rebuilding the
|
|
|
|
|
graphs will require Graphviz (`brew install graphviz` on macOS)
|
|
|
|
|
|
|
|
|
|
## Live Demos
|
2022-08-26 19:21:53 +00:00
|
|
|
|
|
|
|
|
<https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js> is loaded
|
|
|
|
|
on each page, making the `XLSX` variable available to live blocks.
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
### Page-Specific Scripts
|
|
|
|
|
|
|
|
|
|
**Imports do not work from live codeblocks!**
|
|
|
|
|
|
|
|
|
|
Docusaurus does not have an official recommendation for this workflow.
|
|
|
|
|
|
2022-08-26 19:21:53 +00:00
|
|
|
Specific pages can load scripts using the `head` component:
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<head>
|
|
|
|
|
<script src="https://cdn.sheetjs.com/xspreadsheet/xlsxspread.min.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
```
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
**Adding scripts through `head` is known to be brittle!**
|
|
|
|
|
|
|
|
|
|
Live codeblocks that use external libraries in `useEffect` hooks should check
|
|
|
|
|
before using variables. For example, the Dropbox live demo tests if `Dropbox` is
|
|
|
|
|
defined before proceeding. If it is not defined, a message is displayed.
|
|
|
|
|
|
|
|
|
|
```jsx
|
|
|
|
|
function SheetJSTestDropbox() {
|
|
|
|
|
const [msg, setMsg] = React.useState("Dropbox is defined");
|
|
|
|
|
|
|
|
|
|
React.useEffect(() => {
|
|
|
|
|
if(typeof Dropbox == "undefined") return setMsg("Dropbox is not defined");
|
|
|
|
|
}, []);
|
|
|
|
|
return ( <b>{msg}</b> );
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
2023-06-20 01:21:34 +00:00
|
|
|
## Other Notes
|
|
|
|
|
|
2023-09-11 06:53:53 +00:00
|
|
|
`src/theme/Admonition` was swizzled from 2.4.1 to enable `pass` for hiding
|
|
|
|
|
header text. See Docusaurus issue 8568 for more details.
|
|
|
|
|
|
|
|
|
|
`src/theme/prism-include-languages.js` was swizzled from 2.4.1 to support the
|
|
|
|
|
Liquid language. See Docusaurus issue 6872 for more details.
|
