### Global Install with npm/yarn Source: https://vxetable.cn/v4_old This snippet demonstrates how to install VxeTable and Vxe UI components using npm or yarn. It also shows how to import and use these components in a Vue 3 application, specifying dependencies like Vue 3.2+. ```bash npm install vxe-table@4.7.87 # 或者 yarn add vxe-table@4.7.87 ``` ```javascript // ... 纯表格 import VxeUITable from 'vxe-table' import 'vxe-table/lib/style.css' // ... // ...可选 UI import VxeUIAll from 'vxe-pc-ui' import 'vxe-pc-ui/lib/style.css' // ... createApp(App).use(VxeUIAll).use(VxeUITable).mount('#app') ``` -------------------------------- ### CDN Installation for VxeTable and Vxe UI Source: https://vxetable.cn/v4_old This code demonstrates how to include VxeTable and Vxe UI components in an HTML page using Content Delivery Networks (CDNs). It shows the necessary script and link tags for importing Vue, xe-utils, vxe-pc-ui, and vxe-table, along with their respective CSS files. ```html ``` -------------------------------- ### Install and Configure Vxe UI Region Selection Plugin (JavaScript) Source: https://vxetable.cn/pluginDocs/table This snippet demonstrates how to install the Vxe UI enterprise version and configure the region selection plugin. It includes importing necessary modules, the plugin's CSS, and setting the authorization ID. ```javascript import VxeUIAll, { VxeUI } from 'vxe-pc-ui' import 'vxe-pc-ui/lib/style.css' import VxeUITable from 'vxe-table' import 'vxe-table/lib/style.css' // Import extension plugin import './extend-cell-area/vxe-table-extend-cell-area.es6.min' import './extend-cell-area/vxe-table-extend-cell-area.min.css' // Set authorization information VxeUI.setConfig({ // showAuthLog: true, // Whether to display authorization information in the console, professional version supports closing authId: 'Auth ID', // Get authorization and log in to the official website to view in the "User Center" // onAuth (e) { // // Print authorization status // console.log(e) // } }) createApp(App).use(VxeUIAll).use(VxeUITable).mount('#app') ``` -------------------------------- ### 使用 vxe-table-plugin-export-xlsx 插件 Source: https://vxetable.cn/other4 在项目中使用 vxe-table-plugin-export-xlsx 插件。可以通过 NPM 安装并注入 ExcelJS 对象,或者通过 CDN 安装并确保 window.ExcelJS 存在。 ```javascript import VXETable from 'vxe-table' import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx' import ExcelJS from 'exceljs' // 方式1:NPM 安装,注入 ExcelJS 对象 VXETable.use(VXETablePluginExportXLSX, { ExcelJS }) // 方式2:CDN 安装,只要确保 window.ExcelJS 存在即可 // VXETable.use(VXETablePluginExportXLSX) ``` -------------------------------- ### 安装 vxe-table-plugin-export-xlsx 插件 Source: https://vxetable.cn/other4 使用 npm 安装 vxe-table-plugin-export-xlsx 插件及其依赖项 exceljs。请确保安装的版本与 vxe-table 版本兼容。 ```bash npm install vxe-table@4.6.19 vxe-table-plugin-export-xlsx@4.0.6 exceljs ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.