lume
This commit is contained in:
parent
01d7333f44
commit
a86dfdf759
@ -587,7 +587,9 @@ That approach is not explored in this demo.
|
||||
|
||||
:::note
|
||||
|
||||
This demo was verified on 2022 December 14
|
||||
This demo was last tested on 2023 March 14.
|
||||
|
||||
Versions: NodeJS 18.15.0 + ExpressJS 4.18.2 + Formidable 2.1.1
|
||||
|
||||
:::
|
||||
|
||||
|
@ -14,11 +14,96 @@ load data from spreadsheets. New users should consult the official docs.
|
||||
Lume supports refreshing data during development. The generated static sites
|
||||
include the raw data without referencing the underlying spreadsheet files.
|
||||
|
||||
## Lume Demo
|
||||
## Integration Details
|
||||
|
||||
### Installation
|
||||
|
||||
The `sheets` plugin can be imported and invoked in `_config.ts`:
|
||||
|
||||
```ts title="_config.ts"
|
||||
import lume from "lume/mod.ts";
|
||||
// highlight-next-line
|
||||
import sheets from "lume/plugins/sheets.ts";
|
||||
|
||||
const site = lume();
|
||||
|
||||
// highlight-next-line
|
||||
site.use(sheets());
|
||||
|
||||
export default site;
|
||||
```
|
||||
|
||||
### Usage
|
||||
|
||||
:::note
|
||||
|
||||
This was tested against `lume v1.14.2` on 2023 January 20.
|
||||
The official documentation includes notes for more advanced use cases.
|
||||
|
||||
:::
|
||||
|
||||
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.
|
||||
|
||||
#### Single-Sheet Workbooks
|
||||
|
||||
When a workbook has one worksheet, the data is an array of row objects:
|
||||
|
||||
```liquid title="single.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>
|
||||
```
|
||||
|
||||
#### Multi-Sheet Workbooks
|
||||
|
||||
_Reading the First Worksheet_
|
||||
|
||||
The `sheets` plugin accepts an options argument. If the `sheets` property is
|
||||
set to `"first"`, then the plugin will expose row objects for the first sheet:
|
||||
|
||||
```ts title="_config.ts"
|
||||
// the first sheet of each file will be parsed and converted to row objects
|
||||
site.use(sheets({ sheets: "first" }));
|
||||
```
|
||||
|
||||
_Reading all Worksheets_
|
||||
|
||||
The default behavior, when workbooks have multiple sheets, is to present objects
|
||||
whose keys are worksheet names and whose values are arrays of row objects.
|
||||
|
||||
For example, if `pres.numbers` had a sheet named `"Presidents"` and another
|
||||
sheet named `"VicePresidents"`, then the following snippet would print data
|
||||
from the `"Presidents"` sheet:
|
||||
|
||||
```liquid title="multi.njk"
|
||||
<table><thead><th>Name</th><th>Index</th></thead>
|
||||
<tbody>
|
||||
{% for row in pres["Presidents"] %}
|
||||
<tr>
|
||||
<td>{{ row.Name }}</td>
|
||||
<td>{{ row.Index }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
```
|
||||
|
||||
|
||||
## Complete Example
|
||||
|
||||
:::note
|
||||
|
||||
This was tested against `lume v1.15.3` on 2023 March 14.
|
||||
|
||||
This example uses the Nunjucks template format. Lume plugins support additional
|
||||
template formats, including Markdown and JSX.
|
||||
@ -35,8 +120,9 @@ deno run -Ar https://deno.land/x/lume/init.ts
|
||||
|
||||
When prompted, enter the following options:
|
||||
|
||||
- `Use TypeScript for the configuration file`: press Enter (use default `N`)
|
||||
- `Do you want to use plugins`: type `sheets` and press Enter
|
||||
- `Choose the configuration file format`: select `_config.ts`
|
||||
- `Do you want to install some plugins now?`: select `Yes`
|
||||
- `Select the plugins to install`: scroll down, select `sheets`, and submit
|
||||
|
||||
The project will be configured and modules will be installed.
|
||||
|
||||
@ -54,12 +140,12 @@ curl -L -o _data/pres.numbers https://sheetjs.com/pres.numbers
|
||||
<h2>Presidents</h2>
|
||||
<table><thead><th>Name</th><th>Index</th></thead>
|
||||
<tbody>
|
||||
{% for row in pres %}{% if (loop.index >= 1) %}
|
||||
{% for row in pres %}
|
||||
<tr>
|
||||
<td>{{ row.Name }}</td>
|
||||
<td>{{ row.Index }}</td>
|
||||
</tr>
|
||||
{% endif %}{% endfor %}
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
```
|
||||
|
@ -8,6 +8,9 @@ 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
|
||||
the standalone browser scripts.
|
||||
|
||||
The [Standalone scripts](/docs/getting-started/installation/standalone) can be
|
||||
parsed and evaluated in a QuickJS context.
|
||||
|
||||
## Integration Details
|
||||
|
||||
_Initialize QuickJS_
|
||||
|
@ -15,12 +15,12 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@cmfcmf/docusaurus-search-local": "0.11.0",
|
||||
"@docusaurus/core": "2.2.0",
|
||||
"@docusaurus/plugin-client-redirects": "2.2.0",
|
||||
"@docusaurus/preset-classic": "2.2.0",
|
||||
"@docusaurus/theme-common": "2.2.0",
|
||||
"@docusaurus/theme-live-codeblock": "2.2.0",
|
||||
"@docusaurus/theme-mermaid": "2.2.0",
|
||||
"@docusaurus/core": "2.3.1",
|
||||
"@docusaurus/plugin-client-redirects": "2.3.1",
|
||||
"@docusaurus/preset-classic": "2.3.1",
|
||||
"@docusaurus/theme-common": "2.3.1",
|
||||
"@docusaurus/theme-live-codeblock": "2.3.1",
|
||||
"@docusaurus/theme-mermaid": "2.3.1",
|
||||
"@mdx-js/react": "1.6.22",
|
||||
"clsx": "1.2.1",
|
||||
"prism-react-renderer": "1.3.5",
|
||||
@ -29,7 +29,7 @@
|
||||
"xlsx": "https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@docusaurus/module-type-aliases": "2.2.0"
|
||||
"@docusaurus/module-type-aliases": "2.3.1"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
|
Loading…
Reference in New Issue
Block a user