设为首页 加入收藏

TOP

自动化运维:flask-bootstrap + highstock整合(一)
2017-09-30 17:45:44 】 浏览:5268
Tags:自动化 flask-bootstrap highstock 整合

  

1、 在flask-bootstrap的base.html模板中加载highstock.js
     以下是base.html的源码中,调用js文件的例子。
  文件路径: python2.7/site-packages/flask_bootstrap/templates/bootstrap/base.html
     {% block scripts %}
    <script src="{{bootstrap_find_resource('jquery.js', cdn='jquery')}}"></script>
    <script src="{{bootstrap_find_resource('js/bootstrap.js', cdn='bootstrap')}}"></script>
    {%- endblock scripts %}
 
     在例子中,使用了 bootstrap_find_resource(filename,cdn)这个函数调用了js文件,显然在flask-bootstrap我们也需要这样做。
    <script src="{{bootstrap_find_resource('highstock.js', cdn='highstock')}}"></script>
     不过单纯的使用以上的格式调用,你会发现没有什么卵用。
     
2、 真正的调用.js文件的方法。
     如果想要真正的调用.js文件,我们需要知道bootstrap_find_resource(filename,cdn)这个函数的来源。
     根据flask框架的原理,一般这种函数应该存在与这个flask-bootstrap模板的__init__.py文件中,那我们
     去查看这个文件。
      pwd:python2.7/site-packages/flask_bootstrap/__init__.py
     
     首先我们需要备份__init__.py文件。以免你的修改造成了无法挽回的问题,这是一个运维人员的必要素质。
     
     通过阅读源代码,我们关注到了以下几个函数或者内容:
     
     a、 调用js的模板变量:
      JQUERY_VERSION = '1.12.4'
     HTML5SHIV_VERSION = '3.7.3'
     RESPONDJS_VERSION = '1.4.2'
 
     b、 bootstrap_find_resource(filename, cdn, use_minified=None, local=True):
     这个函数中的use_minified参数,我们调用的highstock模板没有mini版本。
     这点需要注意。
     
     c、 def lwrap(cdn, primary=static)
          jquery = lwrap(
            WebCDN('//cdnjs.cloudflare.com/ajax/libs/jquery/%s/' %
                   JQUERY_VERSION), local)
     这两个例子是js模板连接的拼接函数以及实例,我们也需要根据他的格式造出highstock.js的链接变量。
 
     d、 app.extensions['bootstrap'] = {
            'cdns': {
                'local': local,
                'static': static,
                'bootstrap': bootstrap,
                'jquery': jquery,
                'html5shiv': html5shiv,
                'respond.js': respondjs,
     这个字典对应了js模板的名称,在添加的时候也需要注意。
 
3、 修改源码关键部分:
   __init__.py
     HIGHSTOCK_VERSION = '4.2.6'
     app.config.setdefault('BOOTSTRAP_USE_MINIFIED', False)
     
     highstock = lwrap(
            WebCDN('//cdnjs.cloudflare.com/ajax/libs/highstock/%s/' %
                   HIGHSTOC
首页 上一页 1 2 下一页 尾页 1/2/2
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇用VSCode写python的正确姿势 下一篇Python学习笔记——面向对象基础

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目