use webpack asset loaders

This commit is contained in:
SheetJS 2024-10-16 18:33:27 -04:00
parent 2ed1090524
commit d0f75f27c3
9 changed files with 51 additions and 16 deletions

@ -1,4 +1,3 @@
import { read, utils } from 'xlsx';
import url from './cli.xls';
import React, { useEffect, useState } from 'react';
@ -6,9 +5,9 @@ const FrameworkData = () => {
const [fw, setFW] = useState("");
useEffect(() => { (async() => {
const wb = read(await (await fetch(url)).arrayBuffer(), { dense: true });
setFW(utils.sheet_to_html(wb.Sheets["Frameworks"]));
const html = await (await fetch(url)).json();
setFW(html["Frameworks"]);
})(); }, []);
return ( <div dangerouslySetInnerHTML={{__html: fw}}/> );
return ( <p dangerouslySetInnerHTML={{__html: fw}}/> );
};
export default FrameworkData;

@ -1,4 +1,3 @@
import { read, utils } from 'xlsx';
import url from './desktop.xls';
import React, { useEffect, useState } from 'react';
@ -6,9 +5,9 @@ const FrameworkData = () => {
const [fw, setFW] = useState("");
useEffect(() => { (async() => {
const wb = read(await (await fetch(url)).arrayBuffer(), { dense: true });
setFW(utils.sheet_to_html(wb.Sheets["Frameworks"]));
const html = await (await fetch(url)).json();
setFW(html["Frameworks"]);
})(); }, []);
return ( <div dangerouslySetInnerHTML={{__html: fw}}/> );
return ( <p dangerouslySetInnerHTML={{__html: fw}}/> );
};
export default FrameworkData;

@ -1,4 +1,3 @@
import { read, utils } from 'xlsx';
import url from './engines.xls';
import React, { useEffect, useState } from 'react';
@ -7,9 +6,9 @@ const EngineData = () => {
const [binding, setBinding] = useState("");
useEffect(() => { (async() => {
const wb = read(await (await fetch(url)).arrayBuffer(), { dense: true });
setEngines(utils.sheet_to_html(wb.Sheets["Engines"]));
setBinding(utils.sheet_to_html(wb.Sheets["Bindings"]));
const html = await (await fetch(url)).json();
setEngines(html["Engines"]);
setBinding(html["Bindings"]);
})(); }, []);
return ( <>
<p>The following engines have been tested in their native languages:</p>

@ -1,4 +1,3 @@
import { read, utils } from 'xlsx';
import url from './mobile.xls';
import React, { useEffect, useState } from 'react';
@ -6,9 +5,9 @@ const FrameworkData = () => {
const [fw, setFW] = useState("");
useEffect(() => { (async() => {
const wb = read(await (await fetch(url)).arrayBuffer(), { dense: true });
setFW(utils.sheet_to_html(wb.Sheets["Frameworks"]));
const html = await (await fetch(url)).json();
setFW(html["Frameworks"]);
})(); }, []);
return ( <div dangerouslySetInnerHTML={{__html: fw}}/> );
return ( <p dangerouslySetInnerHTML={{__html: fw}}/> );
};
export default FrameworkData;

@ -208,6 +208,7 @@ const config = {
},
],
plugins: [
require.resolve("sheetjs-docusaurus"),
require.resolve("@cmfcmf/docusaurus-search-local"),
[ '@docusaurus/plugin-client-redirects', {
redirects: [

@ -33,6 +33,7 @@
"react-dom": "18.2.0",
"rehype-katex": "7.0.0",
"remark-math": "6.0.0",
"sheetjs-docusaurus": "file:src/plugins/sheetjs-docusaurus",
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
},
"devDependencies": {

@ -0,0 +1,20 @@
/** @type {import('@docusaurus/types').PluginModule} */
export default function SheetJSDocusaurus(context, opts) {
/** @type {import('@docusaurus/types').Plugin} */
const plugin = {
name: "sheetjs-docusaurus",
configureWebpack(config, isServer, utils, content) {
return {
module: {
rules: [
{
test: /\.xls/,
use: [ { loader: __dirname + '/sheetjs-loader' } ]
}
]
}
}
}
};
return plugin;
}

@ -0,0 +1,8 @@
{
"name": "sheetjs-docusaurus",
"version": "0.0.0",
"private": true,
"dependencies": {
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
}
}

@ -0,0 +1,9 @@
const XLSX = require("xlsx");
function loader(content) {
const wb = XLSX.read(content);
const entries = wb.SheetNames.map(n => [n, XLSX.utils.sheet_to_html(wb.Sheets[n])]);
return JSON.stringify(Object.fromEntries(entries));
}
loader.raw = true;
module.exports = loader;