--- title: Bundling Sheets with ParcelJS sidebar_label: ParcelJS pagination_prev: demos/index pagination_next: demos/grid/index sidebar_position: 20 --- import current from '/version.js'; import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; [ParcelJS](https://parceljs.org/) is a module bundler. [SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing data from spreadsheets. This demo uses ParcelJS and SheetJS to export data. We'll explore how to bundle SheetJS in a site using ParcelJS and how to export data to spreadsheets. :::note This demo was last tested on 2023 October 21 against parcel `2.10.0` ::: ## Integration Details [The "Frameworks" section](/docs/getting-started/installation/frameworks) covers installation with Yarn and other package managers. After installing the SheetJS module in a RollupJS project, `import` statements can load relevant parts of the library: ```js import { read, utils, writeFileXLSX } from 'xlsx'; ``` :::warning Parcel Bug Errors of the form `Could not statically evaluate fs call` stem from a Parcel bug[^1]. Upgrade to Parcel version 1.5.0 or later. ::: ## Complete Example This demo follows the [Export Example](/docs/getting-started/examples/export). 0) Initialize a new project: ```bash mkdir sheetjs-parceljs cd sheetjs-parceljs npm init -y ``` 1) Save the following to `index.html`: ```html title="index.html"

SheetJS export demo

``` 2) Install the SheetJS NodeJS module: {`\ npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} {`\ pnpm install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} {`\ yarn add https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} #### Development 3) Run the ParcelJS development server: ```bash npx -y parcel@2.10.0 index.html ``` The process will print a URL: ``` Server running at http://localhost:1234 ``` 4) Access the URL from the previous step (typically `http://localhost:1234`) in a web browser and click the "Click to Export!" button to generate a file. #### Production 5) Edit `package.json` and remove the following line: ```js title="package.json (search for this line and remove)" "main": "index.js" ``` 6) Build the production site: ```bash npx -y parcel@2.10.0 build index.html ``` The production site will be stored in the `dist` folder 7) Start a local web server and serve the `dist` folder: ```bash npx http-server dist ``` Access the displayed URL (typically `http://localhost:8080/`) in a web browser. Click on "Click here to export" to generate a file. [^1]: See [Issue 523 in the Parcel issue tracker](https://github.com/parcel-bundler/parcel/pull/523#issuecomment-357486164)