Symfony中文手册
> Symfony中文手册 > 配合Symfony使用Bower

配合Symfony使用Bower

Symfony和它所有的包儿都被Composer完美地管理。Bower是一个前端依赖管理工具，用于bootstrap或Jquery等。由于Symfony是纯后端框架，它没法帮你使用Bower。幸运的是，Bower易于使用！

安装Bower ¶

Bower是基于Node.js的。确保已经安装了node，然后运行：

1

$  npm install -g bower

这个命令执行完毕后，在控制台终端运行bower命令以查看是否安装正确。

如果你不愿意在系统中安装node，可以使用BowerPHP（一个非官方的Bower PHP端口）。注意目前它还是beta状态。如果你使用了BowerPHP，用bowerphp来替换上例命令中的bower。

在项目中配置Bower ¶

通常，Bower下载所有东西到bower_components/目录。在Symfony中，只有web/文件夹下的文件才能被公开访问，所以你需要配置Bower把东西下载到这里。为此，只需创建一个.bowerrc文件，并加入目标路径（如，web/assets/vendor）：

1
2
3

{
    "directory": "web/assets/vendor/"
}

如果你正在用的前端构建系统是Gulp或grunt，你可以随意设置目录。典型作法是，你应使用这些工具来把所有assets最终转移到web/目录之中。

示例：安装Bootstrap ¶

不管你相信与否，现在你已经准备好在Symfony程序中使用Bower了。作为一个例子，你将把Bootstrap安装到项目中，然后把它包容到布局模板（layout）。

安装依赖 ¶

创建一个bower.json文件，只需运行bower init。现在你已经可以添加东西到项目中了。例如，添加Bootstrap到bower.json然后下载它，只要运行：

1

$  bower install --save bootstrap

这将把Bootstrap连同它的依赖安装到web/assets/vendor（或任何你在.bowerrc中配置的目录）。

更多Bower细节请参考Bower文档。

在模板中包容依赖 ¶

现在依赖已经安装，你可以像普通CSS/JS那样来包容bootstrap到你的模板中了：

  • Twig
  • PHP
1
2
3
4
5
6
7
8
9
10
11
12

{# app/Resources/views/layout.html.twig #}
<!doctype html>
<html>
    <head>
        {# ... #}
 
        <link rel="stylesheet"
            href="{{ asset('assets/vendor/bootstrap/dist/css/bootstrap.min.css') }}">
    </head>
 
    {# ... #}
</html>
 
1
2
3
4
5
6
7
8
9
10
11
12
13

<!-- app/Resources/views/layout.html.php -->
<!doctype html>
<html>
    <head>
        {# ... #}
 
        <link rel="stylesheet" href="<?php echo $view['assets']->getUrl(
            'assets/vendor/bootstrap/dist/css/bootstrap.min.css'
        ) ?>">
    </head>
 
    {# ... #}
</html>

干得好！现在你的站可以使用Bootstrap了。你还可以轻松升级它到最新版，也可以管理其他前端依赖。

我在git中是否要忽略或提交Bower资源 ¶

目前，你差不多应该commit 由Bower下载的assets了，而不是添加目录（比如web/assets/vendor）到你的.gitignore文件中：

1

$  git add web/assets/vendor

为什么？不像Composer，Bower目前还没有“lock”锁定功能，这也就意味着，在不同的服务器上运行bower install来获取你在其他服务器上的“确切资源”，将是毫无保证的。更多细节，参考Checking in front-end dependencies一文。

但是，Bower在将来非常有可能添加一个lock功能（参考：bower/bower#1748）

如果你不是特别在意是否拥有“完全相同”的（assets）版本，你可以只commit bower.json文件。运行bower install时，给你的是bower.json中每个包儿的“版本范围”中的最新版。使用严格版本约束（ strict version constraints，如1.10.*），通常可以确保仅下载兼容的版本。