• grafana二次开发


    grafana官方地址: https://github.com/grafana/grafana

    开发文档:http://docs.grafana.org/project/building_from_source/ 

    grafana官方的readme文档中也有开发文档,但是没有打包的过程,开发文档中有。

    按照官方的文档的顺序:

    一. 环境准备:

    mac下打包的话,不能在centos下运行,只能在centos下打包。

    所以我在mac下开发,centos下打包。

    当然,也可以在window下开发,把生成好的build文件夹和配置文件替换一下,也是可以的

    需要安装go, nodejs等

    提前把GOPATH设置好。

    二.构建后端

    go get github.com/grafana/grafana
    cd $GOPATH/src/github.com/grafana/grafana
    go run build.go setup
    go run build.go build

    第一句go get github.com/grafana/grafana:

    把源码下载到$GOPATH/src/github.com/grafana/grafana路径下,所以GOPATH要设置好

    第三句:go run build.go setup,执行build.go文件的setup:我们看一下它里的操作:

    第四句:go run build.go build,执行build:

     

    也就是执行这两个命令:

    三. 构建前端:

    npm install -g yarn 
    yarn install --pure-lockfile
    yarn watch

    全局安装yarn

    通过yarn进行依赖包的安装

    下面是几种yarn install的区别:也可以查看文档:https://yarnpkg.com/lang/zh-hans/docs/cli/install/

    yarn install                      //安装package.json里所有包,并将包及它的所有依赖项保存进yarn.lock
    yarn install --flat           //安装一个包的单一版本
    yarn install --force           //强制重新下载所有包
    yarn install --production   //只安装dependencies里的包
    yarn install --no-lockfile  //不读取或生成yarn.lock
    yarn install --pure-lockfile //不生成yarn.lock

     yarn watch就是调用了npm中定义的脚本:

    这时,如果我们修改前端的文件,会看到有控制台有更新了。

    为了看到效果,我们可以运行一下

    ./bin/<os>-<architecture>/grafana-server

    控制台的输出会告诉我们,打开浏览器: http://localhost:3000

    但是我发现,如果我们修改了前端的文件,虽然webpack监控到了文件修改,但是页面并没有自动更新,手动刷新一下也不行,

    不知道为什么了,只能重新运行上述命令,再刷新页面才可以看到效果,有知道的同学希望可以指导一下。

    文档中了如果是开发模块下可以安装:go get github.com/Unknwon/bra

    运行:bra run,但在我这里不起作用,报bra不识别命令。

    虽然有一点问题,但是我们能自定义开发:

    我们的要求是修改登录页:

    它对应的css文件:

    开发完成,接下来,就是要打包了:

    执行命令:go run build.go build package

    执行成功后会在dis目录下生成压缩文件:

    或者可以生成rpm文件:

    执行命令:

    go run build.go pkg-rpm
    安装过程会报fpm 不是可执行的命令

    需要手动安装fpm

    gem install fpm


    安装过程报无法连接ssl ruby的一个地址,就是那个地址应该是被墙了,
    添加一个阿里云的地址:
    gem sources -a http://mirrors.aliyun.com/rubygems/ 
    // 移除原生的ruby仓库
    gem sources --remove http://rubygems.org/
    // 再次执行安装即可

    上述命令会在 grafana/dist目录下面生成rpm结尾的文件,即为rpm包

    如果在构建匮乏打包过程中遇到报错,如类型转换问题,依赖包问题,那就把node_modules文件更删除,重新来遍,一般可以解决问题,因为源码肯定没有问题

    如果想要修改title的话,可以修改index.templat.html文件 和config.ts文件中的配置window_title_prefix

    const defaults = {
          datasources: {},
          windowTitlePrefix: 'Grafana - ',
          panels: {},
          newPanelTitle: 'Panel Title',
          playlist_timespan: '1m',
          unsaved_changes_warning: true,
          appSubUrl: '',
          buildInfo: {
            version: 'v1.0',
            commit: '1',
            env: 'production',
            isEnterprise: false,
          },
        };
    
        _.extend(this, defaults, options);

    css文件存储在下列文件中:

     pages中对应着各个页面的css文件

    dark主题和light主题的颜色配置分别是_variables.*.scss文件中

     

     

  • 相关阅读:
    线性回归(Linear Regression)的理解及原理
    3个模型搞清楚用户留存分析
    机器学习简单介绍
    数据分析经典方法:5W2H分析法
    使用guava RateLimiter限流
    Maven之assembly自定义打包
    IDE自动编译
    神奇的$scope
    二分法查找
    深入理解CSS选择器优先级
  • 原文地址:https://www.cnblogs.com/hankuikui/p/10096640.html
Copyright © 2020-2023  润新知