如何链接django模板中由bower安装到静态文件夹中的引导文件？动机_Django_Twitter Bootstrap_Bower

如何链接django模板中由bower安装到静态文件夹中的引导文件？动机

django twitter-bootstrap

如何链接django模板中由bower安装到静态文件夹中的引导文件？动机,django,twitter-bootstrap,bower,Django,Twitter Bootstrap,Bower,我想在django template文件夹中使用bootstrap的bower（grunt）包。我知道在理想情况下，可以将哪些配置为使用引导包的“本地”/“部署”副本现在，我需要一个简单的例子。这就是我要做的步骤1:layout.html 我获取一个hello world模板layout.html（从bootstrapdocs页面）并将其放入django项目中注册的templates文件夹： <!DOCTYPE html> <html lang="en"> &l

我想在django template文件夹中使用bootstrap的bower（grunt）包。我知道在理想情况下，可以将哪些配置为使用引导包的“本地”/“部署”副本

现在，我需要一个简单的例子。这就是我要做的

步骤1:layout.html 我获取一个hello world模板layout.html（从bootstrapdocs页面）并将其放入django项目中注册的templates文件夹：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

这将创建一个名为“bower\u组件”的文件夹

步骤3：链接？

我目前正在查看yeoman board，以检查讨论的内容是否也是我的解决方案。

使用django页面上的文档

{% static "bower_components/bootstrap/dist/css/bootstrap.css" %}

详细地 Layout.html将更改为（假设django 1.6）：


{%block title%}标题{%endblock%}
{%load staticfiles%}
{%block content%}
{%endblock%}

我现在明白了，问题原来很小。我应该删除这个问题吗？我在这里有点困惑。我相信这个问题可能会重演..但不那么琐碎的是使用静态文件传递到django-bootstrap3设置..如果您不知道bower在哪里存储css（

bower\u组件/bootstrap/dist

），这就不那么琐碎了。您的问题和回答帮助了我，也可能帮助其他人开始使用bower将javascript与django相结合（有或没有

django-bower

）。如果您在

{%static%}

路径中使用您不需要的

“bower\u组件/”

。如果您自定义引导，请使用此方法（例如，通过编辑

变量.less

）当您使用bower更新引导时，这些更改不会丢失吗？

{% static "bower_components/bootstrap/dist/css/bootstrap.css" %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{% block title %}title{% endblock %}</title>

    {% load staticfiles %}
    <!-- Bootstrap -->
    <link href="{% static "bower_components/bootstrap/dist/css/bootstrap.css" %}" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    {% block content %}
    {% endblock %}

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="{% static "bower_components/jquery/dist/jquery.min.js" %}"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="{% static "bower_components/bootstrap/dist/js/bootstrap.min.js" %}"></script>
  </body>
</html>