如何使用下载的引导文件

Posted 2023-05-07

【中文标题】如何使用下载的引导文件

【英文标题】：How to use the downloaded bootstrap files

【发布时间】：2015-11-02 16:43:42

【问题描述】：

我从引导站点下载文件。然后我将文件移动到我的项目 css 和 js 文件夹中。我链接了它们，但它不起作用。我用cdn试了一下，效果很好。

这是我的代码：

<link href="/css/bootstrap.min.css" media="all" rel="stylesheet">

【问题讨论】：

你的目录结构看起来像什么？

我放了一张照片

当前打开的是什么文件？ UrlMappings.groovy 包含行 <link href="/css/bootstrap.min.css" media="all" rel="stylesheet">?我不熟悉 groovy 场景，但您需要使用如下路径：../../web-app/css/bootstap-min.css。相反，您也可以使用 bootstrap.min.css 文件的绝对路径。

您使用的是哪个版本的 grails？您可以根据您的 grails 版本利用资源插件或资产管道插件

【参考方案1】：

我相信问题在于你使用：

/css/bootstrap.min.css

第一个/表示你当前驱动的根目录，我相信里面不包含css目录。

更具体地说：

/表示当前驱动的根目录；

./表示当前目录；

../ 表示当前目录的父目录。

您应该链接到您的 css 文件的正确路径（绝对或相对）。您需要使用../css/bootstrap.min.css 或css/bootstrap.min.css 的可能性更大，具体取决于您的目录结构。

【参考方案2】：

您可以将 Twitter Bootstrap 与 Asset-Pipeline 一起使用。步骤是……

创建目录grails-app/assets/bootstrap 将 Twitter Bootstrap css、fonts 和 js 目录复制到步骤 1 中创建的目录中。您应该有这样的路径，例如：grails-app/assets/bootstrap/css/bootstrap.min.css

使用以下内容创建文件 grails-app/assets/bootstrap/bootstrap.css：

+/*

+*= 需要 css/bootstrap.min

+*= 需要 css/bootstrap-theme.min

+*/

使用以下内容创建文件 app/grails-app/assets/bootstrap/bootstrap.js：

+//= 需要 js/bootstrap.min

将以下内容添加到 app/grails-app/assets/javascripts/application.js

//= 需要引导

将以下内容添加到 app/grails-app/assets/stylesheets/application.css

*= 需要引导

确保您的 GSP 或其使用的布局使用 asset:stylesheet 和 asset:javascript 标签引入资产。 （这一步可能已经完成）：

【讨论】：

我想添加该代码，但 *** 拒绝了它。如果您转到“视图”部分下的bertramdev.github.io/asset-pipeline/guide/usage.html#linking，您将看到来自 Asset-Pipeline TagLibrary 的两个标签。这两个标签处理 application.js 和 application.css 文件。您需要将这两个标签添加到 GSP 使用的布局或 GSP 本身中。

我按照您的说明进行操作，但引导程序没有正确加载页面

我不知道您所说的“引导程序没有正确加载页面”是什么意思。看看这个变更集：bitbucket.org/erosa/masteringgrails3/commits/…它将 Twitter Bootstrap 添加到 Grails 3 项目中，该项目已经有 Asset-Pipeline 插件。

对不起，我没有正确用词。当页面加载引导时 和类似的东西不会显示

引导程序未加载。由于您使用的是 Grails 2.x，请检查 grails-app/conf/BuildConfig.groovy 并确保您的插件部分中有 compile ":asset-pipeline:1.9.9"。请注意，您的版本可能略有不同。还要根据我之前提到的变更集检查您的更改。

【参考方案3】：

试试这个..

<link href="css/bootstrap.css" media="all" type="text/css" rel="stylesheet">

它对我有用

【参考方案4】：

我没有使用 gsp 方式查找文件路径。

它应该是这样的：

<link rel="stylesheet" href="$resource(dir: 'css', file: 'bootstrap.min.css')" type="text/css">

【参考方案5】：

在 /bootstrap.min.css 和 /bootstrap.min.js 之前包含路径 像这样 在我的情况下：

<link href="D:/ZIA/Semester 6b/bootstrap-5.0.2-dist/css/bootstrap.min.css" media="all" rel="stylesheet" >
     <script src="D:/ZIA/Semester 6b/bootstrap-5.0.2-dist/js/bootstrap.min.js" ></script>