--- pagination_prev: getting-started/index pagination_next: getting-started/example sidebar_position: 1 sidebar_custom_props: summary: Classic pages with simple <script> tags --- import current from '/version.js'; # Standalone Browser Scripts Each standalone release script is available at <https://cdn.sheetjs.com/>. <div>The current version is {current} and can be referenced as follows:</div> <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <!-- use version ${current} --> <script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`} </code></pre> The `latest` tag references the latest version and updates with each release: ```html <!-- use the latest version --> <script lang="javascript" src="https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js"></script> ``` :::warning A number of services host older versions of the SheetJS libraries. Due to syncing issues, they are generally out of date. They are known CDN bugs. <https://cdn.sheetjs.com/> is the authoritative source for SheetJS modules. ::: ## Browser Scripts `xlsx.full.min.js` is the complete standalone script. It includes support for reading and writing many spreadsheet formats. <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <!-- use xlsx.full.min.js from version ${current} --> <script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js"></script>`} </code></pre> A slimmer build is generated at `dist/xlsx.mini.min.js`. Compared to full build: - codepage library skipped (no support for XLS encodings) - no support for XLSB / XLS / Lotus 1-2-3 / SpreadsheetML 2003 / Numbers - node stream utils removed <details><summary><b>How to integrate the mini build</b> (click to show)</summary> Replace references to `xlsx.full.min.js` with `xlsx.mini.min.js`. Starting from scratch, a single script tag should be added at the top of the HTML page: <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <!-- use xlsx.mini.min.js from version ${current} --> <script lang="javascript" src="https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.mini.min.js"></script>`} </code></pre> </details> ### Internet Explorer and Older Browsers For broad compatibility with JavaScript engines, the library is written using ECMAScript 3 language dialect. A "shim" script provides implementations of functions for older browsers and environments. <div>Due to SSL compatibility issues, older versions of IE will not be able to use the CDN scripts directly. They should be downloaded and saved to a public directory in the site: <ul> <li>Standalone: <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.mini.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/xlsx.mini.min.js</a></li> <li>Shim: <a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js`}>https://cdn.sheetjs.com/xlsx-{current}/package/dist/shim.min.js</a></li> </ul> </div> Add a `script` reference to the shim before the script tag that loads `xlsx.js`: ```html <!-- add the shim first --> <script type="text/javascript" src="shim.min.js"></script> <!-- after the shim is referenced, add the library --> <script type="text/javascript" src="xlsx.full.min.js"></script> ``` ### Web Workers The standalone scripts can be loaded using `importScripts` at the top of the worker scripts: <pre><code parentName="pre" {...{"className": "language-js"}}>{`\ importScripts("https://cdn.sheetjs.com/xlsx-${current}/package/dist/shim.min.js"); importScripts("https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js");`} </code></pre> ## ECMAScript Module Imports in a SCRIPT TAG :::caution This section refers to imports using `script type="module"`. For imports in modern projects using Webpack or React or Angular or VueJS, the installation is described [in the next section](./frameworks). ::: The ECMAScript Module build is saved to `xlsx.mjs` and can be directly added to a page with a `script` tag using `type="module"`: <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <script type="module"> import { read, writeFileXLSX } from "https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs"; </script>`} </code></pre> If Encoding support is required, `cpexcel.full.mjs` must be manually imported: <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <script type="module"> /* load the codepage support library for extended support with older formats */ import { set_cptable } from "https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs"; import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs'; set_cptable(cptable); </script>`} </code></pre> Dynamic imports with `import()` can be used in data export scenarios. This example will download the library only when the export button is pressed: <pre><code parentName="pre" {...{"className": "language-html"}}>{`\ <button id="xport">Export</button> <script type="module"> xport.addEventListener("click", async() => { /* dynamically import the library in the event listener */ // highlight-next-line const XLSX = await import("https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs"); const wb = XLSX.utils.book_new(); const ws = XLSX.utils.aoa_to_sheet([["a","b","c"],[1,2,3]]); XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); XLSX.writeFile(wb, "SheetJSESMTest.xlsx"); }); </script>`} </code></pre> ## Bower :::caution Bower is deprecated and the maintainers recommend using other tools. ::: [Bower](https://bower.io/) plays nice with the CDN tarballs: <pre><code parentName="pre" {...{"className": "language-bash"}}>{`\ npx bower install https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`} </code></pre> Bower will place the standalone scripts in `bower_components/js-xlsx/dist/`