当前位置: 首页 > news >正文

中国重庆网站建设vs2008不能新建网站

中国重庆网站建设,vs2008不能新建网站,在哪里学广告设计培训,wordpress分享 赞插件HBuilderx 插件开发变量名称翻译 ,中文转(小驼峰,大驼峰,下划线,常量,CSS类名) 插件开发文档 工具HBuilderx ,创建项目 创建成功后目录 插件需求 开发时 用来将中文转为&#xff0…

HBuilderx 插件开发变量名称翻译 ,中文转(小驼峰,大驼峰,下划线,常量,CSS类名)

插件开发文档
工具HBuilderx ,创建项目

在这里插入图片描述
在这里插入图片描述

创建成功后目录

在这里插入图片描述

插件需求 开发时 用来将中文转为(小驼峰,大驼峰,下划线,常量,CSS类名)
  1. package.json 文件中配置插件菜单,通过在插件package.json文件中contributes节点下定义的一些JSON格式的配置项。(注意:配置时一定要注意json格式)
{"id": "plugin-fyi","name": "fyi","description": "plugin-fyi","displayName": "plugin-fyi","version": "0.0.0","publisher": "your name","engines": {"HBuilderX": "^2.7.0"},"categories": ["Other"],"main": "./extension","activationEvents": ["*"],"contributes": {"commands": [{"command": "fyi.smallHump","title": "小驼峰"},{"command": "fyi.bigHump","title": "大驼峰"},{"command": "fyi.underline","title": "下划线"},{"command": "fyi.constant","title": "常量"},{"command": "fyi.cssClassName","title": "CSS类名"}],"menus": {"editor/context": [{"group": "z_commands"}, {"title": "小驼峰","command": "fyi.smallHump","group": "z_commands"},{"title": "大驼峰","command": "fyi.bigHump","group": "z_commands"},{"title": "下划线","command": "fyi.underline","group": "z_commands"},{"title": "常量","command": "fyi.constant","group": "z_commands"},{"title": "CSS类名","command": "fyi.cssClassName","group": "z_commands"},{"group": "z_commands"}]},"extensionDependencies": ["plugin-manager"]},"dependencies": {"axios": "^1.7.9","js-md5": "^0.8.3"}
}
  1. 运行插件
    在这里插入图片描述
  2. 运行成功 会打开新的编辑器
    在这里插入图片描述
  3. 打开一个项目 或者新建一个项目 (我这里是打开一个项目)然后右键查看
    在这里插入图片描述
中文翻译需要用到 百度翻译
  1. 百度翻译开放平台
    在这里插入图片描述
  2. 申请秘钥 APPID密钥
    在这里插入图片描述
开始添加逻辑处理
  1. 新建js文件夹 用来处理 翻译 转换的逻辑

  2. 在这里插入图片描述

  3. extension.js 文件 该文件为主文件 需要与 package.json 中的 main 保持一致

	const hx = require("hbuilderx");const commands = require('./js/index')//该方法将在插件激活的时候调用function activate(context) {for (const c of commands) {//订阅销毁钩子,插件禁用的时候,自动注销该command。context.subscriptions.push(c);}}//该方法将在插件禁用的时候调用(目前是在插件卸载的时候触发)function deactivate() {}module.exports = {activate,deactivate}
  1. 调用百度翻译需要用到 axiosMD5.js 安装:
npm install axios
npm install js-md5 
  1. util.js 调用百度api 翻译 *******请更换代码中的 appid 和密钥********
const axios = require('axios');
const hx = require("hbuilderx");
const md5 = require('js-md5');// 封装百度翻译 API 请求函数
module.exports = async function (text) {try {// 在状态栏显示正在转换的消息hx.window.setStatusBarMessage(`正在转换...`);// 百度翻译 API 的配置信息const appid = '你上面申请的appid';const secretKey = '你上面申请的密钥';// 生成随机数 saltconst salt = Math.floor(Math.random() * (65536 - 32768 + 1)) + 32768;// 拼接用于生成签名的字符串const signStr = appid + text + salt + secretKey;// 计算 MD5 哈希值作为签名const sign = md5(signStr);// 发送请求到百度翻译 APIconst response = await axios({method: 'post',url: 'http://api.fanyi.baidu.com/api/trans/vip/translate',data: {q: text,from: 'auto',to: 'en',appid: appid,salt: salt,sign: sign},headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' }});const data = response.data;// 检查响应数据是否包含必要的字段if (data.from && data.to && data.trans_result) {// 解析出翻译结果return data.trans_result[0].dst;} else {// 处理识别失败的情况const errorMessage = `识别失败,错误码: ${data.error_code}`;hx.window.showErrorMessage(errorMessage);return {msg: "识别失败",code: data.error_code};}} catch (error) {// 处理请求过程中可能出现的错误const errorMessage = `请求翻译 API 时发生错误: ${error.message}`;hx.window.showErrorMessage(errorMessage);console.error(errorMessage, error);return {msg: "请求翻译 API 时发生错误",code: -1};} finally {// 清除状态栏的消息hx.window.clearStatusBarMessage();}
};
  1. index.js 转换方法文件
const hx = require("hbuilderx");
const util = require("./util");// 定义字符串转换类型的映射对象
const conversionFunctions = {'1': toCamelCase,'2': toPascalCase,'3': toSnakeCase,'4': toConstantCase,'5': toCssClassName
};// 注册命令的函数
function registerCommand(method, type) {return hx.commands.registerCommand(method, async () => {try {// 获取当前活动的文本编辑器const activeEditor = await hx.window.getActiveTextEditor();if (!activeEditor) {return;}const editor = await activeEditor;const selections = editor.selections;// 遍历每个选中区域for (const selection of selections) {const selectText = editor.document.getText(selection);let text = await util(selectText);// 根据类型获取对应的转换函数const convertFunction = conversionFunctions[type] || toCamelCase;const str = convertFunction(text);// 替换选中区域的文本editor.edit(editBuilder => editBuilder.replace(selection, str));}} catch (error) {console.error('执行命令时发生错误:', error);}});
}// 小驼峰转换函数
function toCamelCase(str) {const words = str.split(' ');return words.map((word, index) => {if (index === 0) {return word.toLowerCase();}return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();}).join('');
}// 大驼峰转换函数
function toPascalCase(str) {return str.split(' ').map(word => {return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();}).join('');
}// 下划线转换函数
function toSnakeCase(str) {return str.replace(/\s/g, '_').toLowerCase();
}// 常量转换函数
function toConstantCase(str) {return str.replace(/\s/g, '_').toUpperCase();
}// CSS类名转换函数
function toCssClassName(str) {return str.toLowerCase().replace(/\s/g, '-');
}// 注册各个命令
const smallHump = registerCommand('fyi.smallHump', '1');
const bigHump = registerCommand('fyi.bigHump', '2');
const underline = registerCommand('fyi.underline', '3');
const constant = registerCommand('fyi.constant', '4');
const cssClassName = registerCommand('fyi.cssClassName', '5');// 导出注册的命令
module.exports = [smallHump,bigHump,underline,constant,cssClassName
];
  1. 至此 全部开发结束。重新运行插件
    在这里插入图片描述
  2. 测试正常,开发结束。
优化
  1. 菜单合并 package.json
{"id": "plugin-fyi","name": "fyi","description": "plugin-fyi","displayName": "plugin-fyi","version": "0.0.0","publisher": "your name","engines": {"HBuilderX": "^2.7.0"},"categories": ["Other"],"main": "./extension","activationEvents": ["*"],"contributes": {"commands": [{"command": "fyi.smallHump","title": "小驼峰"},{"command": "fyi.bigHump","title": "大驼峰"},{"command": "fyi.underline","title": "下划线"},{"command": "fyi.constant","title": "常量"},{"command": "fyi.cssClassName","title": "CSS类名"}],"menus": {"editor/context": [{"id": "fyi","title": "來啊快樂啊","group": "assist"},{"title": "小驼峰","command": "fyi.smallHump","group": "fyi@1"},{"title": "大驼峰","command": "fyi.bigHump","group": "fyi@2"},{"title": "下划线","command": "fyi.underline","group": "fyi@3"},{"title": "常量","command": "fyi.constant","group": "fyi@4"},{"title": "CSS类名","command": "fyi.cssClassName","group": "fyi@5"}]},"extensionDependencies": ["plugin-manager"]},"dependencies": {"axios": "^1.7.9","js-md5": "^0.8.3"}
}

在这里插入图片描述

  1. 配置快捷键 点击工具 ----自定义快捷键
    在这里插入图片描述
  2. 添加代码 保存
    在这里插入图片描述
    在这里插入图片描述
  3. 快捷键使用正常。
完结。
http://www.dtcms.com/a/470126.html

相关文章:

  • 个人二级网站怎么做任房保障和城乡建设局网站
  • 企业网站主页设计图微信小程序超市平台
  • 《MCU职位》面试问题
  • 用于化学绘图与IUPAC命名:InDraw 软件的基本使用指南
  • 网页设计与网站建设设计报告建设银行网站查余额
  • 网站meta 优化建议做网站的程序员进什么公司好
  • 【电路】电容的频率特性与通阻范围计算详解
  • LLM 笔记 —— 05 有关影像的生成式 AI
  • MySQL字符集引起的锁表、唯一索引重复问题
  • 算法6.0
  • 【C 学习】12.1-函数基础
  • 11.程序地址空间_2
  • Java的方法重写/覆盖
  • 门户网站建站要求外国做家具的网站
  • 『 数据库 』MySQL复习(表的约束)
  • 房地产开发公司网站源码做高端网站的公司
  • 【vue】使用web worker上报日志:
  • MySQL 与Power BI 的作用,以及在数据分析中扮演的角色
  • k歌里的相片是通过网站做的吗typecho与Wordpress同步
  • 如何做中英版网站简单写文章的网站
  • Linux 进程通信——基于责任链模式的消息队列
  • 手机能做网站吗北京软件开发公司哪家专业
  • 物流网站的建设免费推广平台排行榜
  • iOS一直讲的单元格优化
  • 信阳网站seo用手机怎么做网站
  • 【Canvas技法】 卡通版太阳的三种画法
  • 词根学习笔记 | Agri系列
  • PHP解决跨域请求问题的两种实用方法
  • 语音大模型自监督训练思路
  • 辉芒微单片机FT60E12X,Touch 系列8位单片机MCU简要分析