forked from sheetjs/docs.sheetjs.com
138 lines
3.9 KiB
Bash
Executable File
138 lines
3.9 KiB
Bash
Executable File
#!/bin/bash
|
|
# https://docs.sheetjs.com/docs/demos/static/vitejs
|
|
# This script builds the Pure Data test and Base64 test. It does not test HMR!
|
|
cd /tmp
|
|
rm -rf sheetjs-vite-static
|
|
mkdir sheetjs-vite-static
|
|
cd sheetjs-vite-static
|
|
|
|
for n in {2..5}; do
|
|
npm create -y vite@$n sheetjs-vite-$n -- --template vue-ts
|
|
cd sheetjs-vite-$n
|
|
npm i
|
|
npm i --save https://cdn.sheetjs.com/xlsx-0.20.2/xlsx-0.20.2.tgz
|
|
npm i --save puppeteer express@4
|
|
if [[ "$n" == "2" ]]; then
|
|
# The default vitejs2 + vuejs project does not build
|
|
#
|
|
# src/App.vue:8:3 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
|
|
#
|
|
# 8 <img alt="Vue logo" src="./assets/logo.png" />
|
|
# ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
#
|
|
# Before the TS errors, there is a message:
|
|
# Please update to v0.35.0 or higher for TypeScript version: 4.9.5
|
|
#
|
|
# Forcefully upgrading `vue-tsc` appears to be innocuous.
|
|
npm i --save vue-tsc@latest
|
|
fi
|
|
curl -O https://docs.sheetjs.com/vitejs/vite.config.ts
|
|
mkdir -p data
|
|
curl -L -o data/pres.xlsx https://docs.sheetjs.com/pres.xlsx
|
|
|
|
cat >test.cjs <<EOF
|
|
const puppeteer = require('puppeteer');
|
|
const express = require('express');
|
|
const app = express();
|
|
app.use(express.static('./dist/'));
|
|
app.listen(7262, async() => {
|
|
await new Promise((res,rej) => setTimeout(res, 1000));
|
|
const browser = await puppeteer.launch();
|
|
const page = await browser.newPage();
|
|
page.on("console", msg => console.log("PAGE LOG:", msg.text()));
|
|
await page.setViewport({width: 1920, height: 1080});
|
|
await page.goto('http://localhost:7262/');
|
|
await page.addScriptTag({ url: 'https://cdn.sheetjs.com/xlsx-0.20.2/package/dist/xlsx.full.min.js' });
|
|
await new Promise((res,rej) => setTimeout(res, 1000));
|
|
const csv = await page.evaluate(() => {
|
|
const tbl = document.querySelector('table');
|
|
const ws = XLSX.utils.table_to_sheet(tbl);
|
|
return XLSX.utils.sheet_to_csv(ws);
|
|
});
|
|
console.log(csv);
|
|
await browser.close();
|
|
process.exit();
|
|
});
|
|
EOF
|
|
|
|
## Pure Data Test
|
|
cat >src/components/HelloWorld.vue <<EOF
|
|
<script setup lang="ts">
|
|
// @ts-ignore
|
|
import data from '../../data/pres.xlsx?sheetjs';
|
|
</script>
|
|
|
|
<template>
|
|
<table>
|
|
<tr><th>Name</th><th>Index</th></tr>
|
|
<tr v-for="(row,R) in data" v-bind:key="R">
|
|
<td>{{row.Name}}</td>
|
|
<td>{{row.Index}}</td>
|
|
</tr>
|
|
</table>
|
|
</template>
|
|
EOF
|
|
|
|
npm run build
|
|
npm ls | grep "vite@"
|
|
node test.cjs
|
|
# Expected output: CSV contents of first sheet
|
|
|
|
echo "Clinton" $(grep Clinton dist/assets/*.js | wc -l) "BESSELJ" $(grep BESSELJ dist/assets/*.js | wc -l)
|
|
# Expected output: Clinton 1 BESSELJ 0
|
|
|
|
## HTML Test
|
|
cat >src/components/HelloWorld.vue <<EOF
|
|
<script setup lang="ts">
|
|
// @ts-ignore
|
|
import html from '../../data/pres.xlsx?html';
|
|
</script>
|
|
|
|
<template>
|
|
<div v-html="html"></div>
|
|
</template>
|
|
EOF
|
|
|
|
npm run build
|
|
npm ls | grep "vite@"
|
|
node test.cjs
|
|
# Expected output: CSV contents of first sheet
|
|
|
|
echo "Clinton" $(grep Clinton dist/assets/*.js | wc -l) "BESSELJ" $(grep BESSELJ dist/assets/*.js | wc -l)
|
|
# Expected output: Clinton 1 BESSELJ 0
|
|
|
|
## Base64 Test
|
|
cat >src/components/HelloWorld.vue <<EOF
|
|
<script setup lang="ts">
|
|
// @ts-ignore
|
|
import b64 from '../../data/pres.xlsx?b64';
|
|
import { read, utils } from "xlsx";
|
|
/* parse workbook and convert first sheet to row array */
|
|
const wb = read(b64);
|
|
const ws = wb.Sheets[wb.SheetNames[0]];
|
|
interface IPresident { Name: string; Index: number; };
|
|
const data = utils.sheet_to_json<IPresident>(ws);
|
|
</script>
|
|
|
|
<template>
|
|
<table>
|
|
<tr><th>Name</th><th>Index</th></tr>
|
|
<tr v-for="(row,R) in data" v-bind:key="R">
|
|
<td>{{row.Name}}</td>
|
|
<td>{{row.Index}}</td>
|
|
</tr>
|
|
</table>
|
|
</template>
|
|
EOF
|
|
|
|
npm run build
|
|
npm ls | grep "vite@"
|
|
node test.cjs
|
|
# Expected output: CSV contents of first sheet
|
|
|
|
echo "Clinton" $(grep Clinton dist/assets/*.js | wc -l) "BESSELJ" $(grep BESSELJ dist/assets/*.js | wc -l)
|
|
# Expected output: Clinton 0 BESSELJ 1
|
|
|
|
cd -
|
|
done
|