Django+Markdown+Pygments 支持Markdown 实现代码高亮

Markdown部分
  1. 安装markdown pip install markdown
  2. view.py中导入包 from markdown import markdown
  3. 使用markdown()将需要用markdown格式解析的内容(字符串)封装起来。 注:models里面有一个Article类,Article里面有一项是content存储博客内容。

    def detail(request, id):
        try:
            post = Article.objects.get(id=str(id))
            #for markdown test
            post.content = markdown(post.content) 
        except Article.DoesNotExist:
            raise Http404
        return render(request, 'post.html', {'post' : post}) 
    
  4. 在后台编辑博文
    > ## This is a test.
    >
    > 1. This is the first list item.
    > 2. This is the second list item.

  5. 前台显示 {{ post.content | safe}},注意使用了safe过滤器,防止内容在输出前被解析。
    ps:和这个问题是一个原因,django数据库里Html代码,如何在前台让浏览器正确解析?

Pygments部分
  1. 官网下载最新的版本的Pygments
  2. 使用pip安装下载的包Pygments-2.0.2.tar.gz,敲命令pip install Pygments-2.0.2.tar
  3. 运行如下命令pygmentize -S default -f html -a .codehilite > code.css,在文件夹下会发现生成了code.css文件,将这个css文件加入到你的static文件夹下style里面(随便你放哪里找得到就好)。
  4. 在需要高亮的html文件里面导入刚刚生成的css文件,例如我的是<link type="text/css" rel="stylesheet" href="{{ STATIC_URL }}styles/code.css"/>
  5. 还记得刚刚代码里面的post.content = markdown(post.content)
    吧,在后面加上['codehilite'],即为post.content = markdown(post.content,['codehilite'])
  6. 刷新前台,显示代码已经高亮。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
django和vue是两种不同的编程框架,它们可以结合使用来开发风险控制系统。在这个系统中,django可以用于后端开发,处理数据存储、业务逻辑和用户认证等;而vue可以用于前端开发,负责用户界面的展示和交互。 为了实现风险控制系统,首先需要建立数据库模型来存储风险相关的数据,例如风险类型、风险等级、风险责任人等。在django中,可以使用ORM来定义这些数据模型,并且实现对数据的增删改查操作。同时,还需要编写业务逻辑来处理风险控制的流程,例如风险评估、风险分析和风险报告等。这部分可以在django的视图函数中实现,并且可以使用django rest framework来提供API接口。 在前端方面,可以使用vue来构建风险控制系统的用户界面。可以使用Vue Router来管理页面路由,使用Vuex来管理状态,以及使用组件化的方式来构建各个功能模块。通过与后端API的交互,实现数据的展示和用户交互功能。 在整个系统开发过程中,还需要考虑安全性和性能优化的问题。在django中可以使用各种中间件和装饰器来增强系统的安全性,例如CSRF保护和JWT认证等。另外,还可以使用缓存和异步任务队列来优化系统的性能。 综上所述,django vue风险控制系统的代码实现需要后端和前端的协同配合,充分利用两种框架的特点来实现系统的数据管理和用户界面展示,同时也需要关注系统的安全性和性能优化。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值