Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >前端|npm全局创建wps加载项

前端|npm全局创建wps加载项

作者头像
算法与编程之美
发布于 2020-03-31 08:22:02
发布于 2020-03-31 08:22:02
2K0
举报

问题描述

基于vscode的方式创建wps加载项在获取类型之后,无法自动生成wps加载项,在网上查询相关问题内容也无果。不过Wps官方文档又更新了通过npm全局的方式创建wps加载项,下面就来具体介绍一下。

解决方案

创建步骤:

1.准备开发环境

(1)安装wps 2019

(2)安装node.js环境

(3)安装 Visual Studio Code

2.创建wps加载项

打开命令窗口(win+R 输入cmd),然后输入安装命令npm install -g wps js

图 2.2.1 执行安装命令

输入wpsjs create Hello创建一个新的文件(如果存在相同的文件,会提示删除)。

图 2.2.2 创建新文件

按提示选择需要创建的类型和框架,这里的UI框架提供了两种选择,“无”代表示例代码中都是原生的js及html代码,没有集成vue\react等流行的前端框架。"Vue"代表生成的示例代码集成了Vue相关的脚手架,在实际的项目中选用Vue基于示例代码可能更适合做工程化的开发。

图 2.2.3 选择类型和框架

确认后会生成Hello的文件夹,可以进入文件夹查看目录。

图 3.2.4 查看文件目录

输入命令wpsjs debug启动wps 2019

图 3.2.5 启动wps

启动成功后会自动跳转到wps 2019,然后再顶部栏找到wps加载项示例

图 3.2.6 选择wps加载项示例

执行此命令后即可开始调试("Alt+F12"打开调试器),wpsjs工具包会自动启动wps并加载HelloWps这个加载项,同时wpsjs工具包启了一个http服务,此服务主要提供两方面的能力:

a.提供前端页的的热更新服务,wpsjs工具包检测到网页数据变化时,自动刷新页面。

b.提供wps加载项的在线服务,wpsjs生成的代码示例是一个在线模式,wps客户端程序实际上是通过http服务来请求在线的wps加载项相关代码和资源的。

创建完成后就可以用vscode软件打开示例代码,然后愉快地进行开发了。

END

编 辑 | 王楠岚

责 编 | 冯 博

where2go 团队


本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-03-30,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 算法与编程之美 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
node、npm、vue安装 -- VUE 项目 demo 实例
5. 用 vue-cli 构建项目 (windows 和 linux 都可以按此方法构建)
微风-- 轻许--
2022/04/13
9490
node、npm、vue安装 -- VUE 项目 demo 实例
【前端开发】创建Vue3项目
安装Node.js的步骤因操作系统而异,但下面提供了一个通用且详细的Windows系统上的安装流程。对于其他操作系统(如macOS或Linux),安装过程大致相似,主要区别在于下载链接和安装包类型。
云帆沧海
2024/03/21
1700
《Vue3.0抢先学》系列之:一个简单的例子
书接上文:你被我撩拨了一下,从Github上下载了Vue3.0的源码。然后呢,你是不是已经迫不及待的想知道到底怎么样快速的把这个源代码用起来呢?
一斤代码
2019/10/29
1.3K0
《Vue3.0抢先学》系列之:一个简单的例子
使用开源Cesium+Vue实现倾斜摄影三维展示
倾斜摄影转换工具:CesiumLab—下载地址:http://www.cesiumlab.com/
Kiba518
2022/09/09
3.2K0
使用开源Cesium+Vue实现倾斜摄影三维展示
Web前端学习 第7章 Vue基础教程2 创建Vue项目
在第七章我们已经介绍了如何使用npm命令全局安装node包,本节我们需要安装一个名为@vue/cli的包来创建我们的vue项目,安装代码如下所示:
学习猿地
2020/06/23
3680
前端|对wps加载项的探究
WPS 加载项是一套基于 Web 技术用来扩展 WPS 应用程序的解决方案。每个 WPS 加载项都对应打开了一个网页,并通过调用网页中 JavaScript 方法来完成其功能逻辑。WPS 加载项打开的网页可以直接与 WPS 应用程序进行交互,同时一个 WPS 加载项中的多个网页形成了一个整体, 相互之间可以进行数据共享。开发者不必关注浏览器兼容的问题,因为 WPS 加载项的底层是以 Chromium 开源浏览器项目为基础进行的优化扩展。
算法与编程之美
2020/03/25
3.6K0
前端Demo|vue.js创建第一个hello-world文件|适合有一定js基础的同学
npm install -g cnpm --registry=https://registry.npm.taobao.org
微笑的小小刀
2022/04/12
8240
前端Demo|vue.js创建第一个hello-world文件|适合有一定js基础的同学
【Vue3】利用vite创建vue3项目
vite是一个web开发构建工具,由于其原生ES模块导入方式,可以实现闪电般的冷服务器启动。相对于webpack可以更快创建项目。 注意:vite不支持IE11
颜颜yan_
2023/03/20
1.2K0
【Vue3】利用vite创建vue3项目
Vue开发实战01-创建基础项目,包管理使用yarn
vue是一个用于创建用户界面的开源渐进式JavaScript框架,是目前市面上比较流行的前端框架之一。vue的开发者是中国人,在国内项目中使用的地方比较多。对于一个大前端来说,几乎是必学的东西;
JQ实验室
2022/09/21
7590
Golang: gin-vue-admin框架介绍
gin-vue-admin基于gin+vue搭建的后台管理系统框架,集成jwt鉴权,权限管理,动态路由,分页封装,多点登录拦截,资源权限,上传下载,代码生成器,表单生成器,通用工作流等基础功能,五分钟一套CURD前后端代码,目前已支持VUE3,欢迎issue和pr~
OwenZhang
2021/12/08
2K0
Golang: gin-vue-admin框架介绍
Vue—什么是Vue,怎样配置和搭建Vue3项目
Vue 是一套用于构建用户界面的渐进式框架。 与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合,另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用提供驱动。
中杯可乐多加冰
2024/10/08
3670
创建一个vue项目并配置默认页面
npm  install  -g  cnpm  --registry=https://registry.npm.taobao.org
余生大大
2022/11/02
1.5K0
创建一个vue项目并配置默认页面
Web前端学习 第5章 node基础教程3 npm常用命令
npm有两种方式安装第三方模块:本地安装和全局安装,使用哪种安装方式,取决于我们用npm模块来做什么。
学习猿地
2020/06/19
4310
Web前端学习 第5章 node基础教程3 npm常用命令
谷粒学院项目实战04——讲师管理模块前端基础(下)
使用axios需要依赖axio.min.js.如果找不到资源可以参考https://blog.csdn.net/weixin_43274097/article/details/106570717。
半旧518
2022/10/26
5400
谷粒学院项目实战04——讲师管理模块前端基础(下)
前端包管理工具与配置项
任何一个项目的构建离不开工具和统一的管理标准,在项目开发和维护过程中,我们需要了解安装包的相应工具和配置文件,以此来有效的进行项目的迭代和版本的更新,为项目提供基本的运行环境。
程序员海军
2023/11/07
6800
通过d.ts文件,让VSCode在写js代码时能够有智能提示代码补全
在VSCode里,对常见的关键字和可推断的对象确实是可以有智能提示,但一旦使用其他第三方库,这个智能提示就不管用了,而对于面向轮子来开发的应用层开发来说,就很痛苦。
Excel催化剂
2021/08/18
11.7K0
Node.js学习笔记(一)——Node.js概要、NPM与package.json
Node.js 是一个基于Google Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。Node.js 的包管理器 npm,是全球最大的开源库生态系统。
张果
2022/09/28
2.8K0
Node.js学习笔记(一)——Node.js概要、NPM与package.json
前端开发3年了,竟然不知道什么是 Vue 脚手架?(上)
CLI -- Command-Line Interface 命令行界面,俗称脚手架。
呆呆
2021/12/01
7490
借助 VuePress 和 GitBook ,10 分钟即可免费部署你的静态博客网站
因为自己平时经常写博客,也有博客网站,所以 Leader 叫我做一个 CMS 的帮助中心的技术选型,CMS 的帮助中心的功能:是通过文章来教用户如何使用我们的项目。
夜尽天明
2019/12/19
2.1K0
借助 VuePress 和 GitBook ,10 分钟即可免费部署你的静态博客网站
npm 及vue,router,webpack安装 快速起步
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
多凡
2019/11/01
1.2K0
推荐阅读
相关推荐
node、npm、vue安装 -- VUE 项目 demo 实例
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档