SpreadJS V11SP1 支持 npm 安装

收藏

本帖最后由 alizee1025 于 2018-6-13 10:49 编辑

概述

SpreadJS V11SP1 正式发布到 npm，地址https://www.npmjs.com/~grapecity 。项目中使用 SpreadJS 将更加方便优雅。

您可以通过命令 npm install @grapecity/spread-sheets 引用 spread.sheets 资源。Excelio、PDF、chart 以及语言资源都是独立 package，需要单独安装。

（原文链接）

以 webpack 项目为例，下面将展示如何使用 Spread.Sheets。

1、安装 Node.js 和 Npm

2、新建"spreadjs_webpack"文件夹

3、在文件夹中通过 npm 命令创建一个新的工程

输入"npm init -y" 创建 package.json

{
"name": "spreadjs_webpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}

复制代码

4、安装 webpack
输入命令 "npm install webpack --save-dev"
输入命令 "npm install webpack-cli --save-dev"

5、创建如下结构及文件
spreadjs_webpack

|- package.json
|- webpack.config.js
|- /dist
|- index.html
|- /src
|-index.js

复制代码

package.json

{ "name": "spreadjs_webpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack --config webpack.config.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.5.0",
"webpack-cli": "^2.0.14"
}
}

复制代码

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SpreadJS Development</title>
<script src="bundle.js"></script>
</head>
<body>
<div id="ss" style="width:80%;height:80vh;border:1px solid lightgray"></div>
</body>
</html>

复制代码

6、安装 Spread.Sheets

输入命令 "npm install @grapecity/spread-sheets --save"

安装完成后您会在 package.json kandao "@grapecity/spread-sheets": "^11.1.0"spread.sheets npm 模块会安装在 "node_modules-> @grapecity -> spread-sheets" 文件夹中。

从 "node_modules-> @grapecity -> spread-sheets -> styles"复制 Spread.Sheets css 到 dist 文件夹。

7、引用 Spread.Sheets 模块并实现相关逻辑

Update index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SpreadJS Development</title>
<link href="gc.spread.sheets.excel2013white.css" rel="stylesheet"/>
<script src="bundle.js"></script>
</head>
<body>
<div id="ss" style="width:80%;height:80vh;border:1px solid lightgray"></div>
</body>
</html>

复制代码

Update index.js

var gc = require('@grapecity/spread-sheets');
window.onload = function () {
var workbook = new gc.Spread.Sheets.Workbook(document.getElementById("ss"));
var worksheet = workbook.getActiveSheet();
worksheet.getCell(3,3).value("SpreadJS Npm Package in Webpack Project");
}

复制代码

8、Build and Run

输入命令 "npm run build"，浏览器查看效果。

从何处获取最新版的 SpreadJS？

新一代 JavaScript 电子表格控件 SpreadJS 正式发布 2018 V11.1 版本，新版本提供撤销/重做功能，并增强了 UI 和数据筛选，极大的提升了产品的实用性，并更加方便优雅的嵌入您的应用系统。点击此处立即试用。

想要查看更多 SpreadJS 新版本特性，请点击此处。

如果你的项目需要一款功能和 Excel 类似且支持 WinForm、ASP.NET、XAML 、WinRT 等多个平台的表格控件。用于在您的应用系统中实现表格数据录入和编辑等交互功能，并且提供灵活的定制能力和丰富的数据可视化效果。Spread Studio 表格控件能完全满足您的需求，它目前已经广泛应用在财务、预算、工程、统计等领域的信息系统中。通过图表引擎和数据可视化功能，为商业表单控制面板提供丰富、有效的内容信息。点击这里，了解 Spread Studio。

如果您不想借助 Microsoft Excel，并想超快批量操作 Excel 文件，我们推荐您使用 Spread 表格组件，无需安装 Microsoft Excel，通过代码，您即可快速创建、导入、编辑、转化、导出 Excel 文件，支持多种应用程序平台的调用，不限服务器类型，拥有高性能快速处理引擎，大幅缩短您的开发时间。点击这里，了解 Spread 表格组件。

如果你还有其他疑问，可以到 GCDN (葡萄城技术社区)获得技术支持：

SpreadJS专区：http://gcdn.gcpowertools.com.cn/showforum-185-1.html

GCDN：http://gcdn.grapecity.com.cn/

官方网站：葡萄城官网

		自动登录	找回密码
密码			立即注册

SpreadJS V11SP1 支持 npm 安装

0 个回复

活字格认证

活字格高级认证

微信认证勋章