MENU

Grafana汉化笔记

July 23, 2018 • Read: 11801 • 笔记,GitHub

Grafana汉化笔记

tags:网站


[toc]


前言

本文主要记录Grafana汉化过程,以备后续查阅。
Grafana中文版本基于官方源码(前端部分)进行汉化。汉化内容主要为前端UI界面文本,不涉及后端服务器内容。

重要提示!!
Grafana官方使用webpack进行前端代码的打包发布,实际发行版本(Windows/Linux)的前端文件均为打包压缩后的资源文件,直接汉化压缩后的文件虽能起到汉化作用,但是非常不利于版本升级维护,且汉化工作量巨大。
因此,建议按照官方的开发流程,直接修改官方的前端源码,再使用webpack重新发布,同时使用git跟随官方版本进行更新升级。

1. 环境准备

1.1 fork官方源码

打开Grafana官方Github仓库,fork官方源码至自己账户仓库下。
Grafana官方仓库链接https://github.com/grafana/grafana

1.2 创建汉化分支

使用SourceTree(或官方的GiHubDesktop程序)clone自己账户的仓库到本地。

官方默认为master分支(未发布版本),向下滚动找到当前发布版本标签。(当前为v5.2.1)

在已发行分支(v5.2.1)上右键创建新分支(汉化分支)。

需检出新的汉化分支!否则改动的是官方的分支

1.3 安装开发环境

在项目(仓库)文件夹中运行npm install 安装项目依赖环境。

可使用淘宝镜像cnpm install加快安装速度

使用IDE打开项目,在此以WebStorm为例。

双击左侧start或命令行运行npm start 启动 webpack-dev-server

如出现报错请重新运行npm install修复环境

1.4 搭建开发服务器

打开localhost:3333访问本地开发服务器,发现无法访问。
webpack-dev-server只是作为一个代理服务器进行开发中的资源调试,真正的数据请求全部代理到了Grafana官方后台服务器localhost:3000,需先运行grafana官方版本。

下载官网Grafana-Windows版本并运行。测试访问localhost:3000。若localhost:3000能正常访问,则返回刷新localhost:3333,发现也可正常访问。



此时,localhost:3000使用的是官方发行版本的前端资源,需修改配置文件,使其指向开发目录中的资源。
关闭Grafana官方版本服务器,打开\grafana-5.2.1\conf\defaults.iniapp_mode更改为development,静态文件路径,使其指向开发目录中的/public文件夹。

重新运行Grafana官方版本服务器,测试访问。

至此,环境准备完毕,可以开始汉化工作。

2. 汉化Grafana

Grafana全部的前端文件都位于/public文件夹内,这里我们登录页面为例,介绍汉化方法。

启用Grafana官方服务器,和webpack-dev-server(运行 npm start)。

修改/public/partials/login.html文件内容,将Log in改为登录并保存,webpack-dev-server会自动编译并更新文件,在浏览器中可实时看到更改的内容。(localhost:3333)

3. 打包发布中文Grafana

运行npm build命令,编译项目文件。编译压缩后的文件会输出到/buildview文件夹下,建议实际使用直接复制整个/public文件夹替换线上生产版本。(Windows版本为/public, Linux版本为/usr/share/grafana/public

Tags: None
最后编辑于: July 8, 2019
Leave a Comment

已有 11 条评论
  1. zzz zzz

    感谢

  2. sunhuijun sunhuijun

    请问汉化grafana主页的菜单栏是具体改哪个文件

    1. 门赢 门赢

      @sunhuijun可能是后端golang的代码

  3. liaolei liaolei

    有没有其他解决方案啊,不用直接在页面上改的?

    1. @liaolei您好,我暂时没发现其它解决方案,官方没做多语种版本。

    2. test test

      @隔壁卖瓜王叔叔google浏览器直接翻译,应该也能满足汉化吧

  4. 吕先生 吕先生

    请问可以专门为我们的企业定制一个汉化版本吗? 如果能集成到我们的应用系统里面。我们可以支付相关费用。
    联系方式: 189-3511-5940 吕先生

  5. hussar hussar

    您好,最后的打包是执行npm run build命令 node调用grunt执行打包的吗,为什么我的超级慢哦,等了好久都没有完成,还是哪里有错误呀@(小乖)@(小乖)

  6. @(test)测试

  7. 君宝 君宝

    老铁,是不是只有V5.2版本能用啊?

  8. 学习者 学习者

    你好,最近我在研究这个,想咨询一下你,可否微信联系一下?不会耽误你太久