Quick Start (Vanilla JS)

SheetXL can be used with any framework.

Installation

SheetXL was written using React can but can be easily included into any project using either a package bundler or with our zero-install ESM module.

caution

This page is UNDER DEVELOPMENT and instructions are not correct. Visit Discord for help.

Bundler
ESM

yarn
npm

yarn add @sheetxl/vanilla-js

npm install @sheetxl/vanilla-js

To include within your bundler. Once installed SheetXL components can be used as any Javascript component.

import SheetXL from '@sheetxl/vanilla-js';

// Create a new workbook model
const workbookModel = new SheetXL.models.WorkbookModel();
// Create a new workbook component inside a workbook-container element
const sheetxl = new SheetXL.Workbook({
  container: document.getElementById("workbook-container"),
  model: workbookModel
});

<!doctype html>
<head>
</head>
<body>
    <div id="container" style="width: 800px; height: 400px;"></div>
  <script>
    import ('process.env.DEPLOY_LOCATION/js/index.js').then((sheetxl) => {
      let workbook = new sheetxl.models.WorkbookModel();
      sheetxl.components.newComponent(
        'sheet',
        document.getElementById("container"),
        {
          component: {
            model: workbook
          }
        }
      );
    });
  </script>
</body>
</html>

Installation​

Installation