Symfony2 共享的 CSS 和 JS 资产在哪里，最佳实践是明智的？

Posted 2023-03-10

【中文标题】Symfony2 共享的 CSS 和 JS 资产在哪里，最佳实践是明智的？

【英文标题】：Where do Symfony2 shared CSS and JS assets go, best practice wise?

【发布时间】：2011-08-01 19:37:51

【问题描述】：

我通常将我的 JS 和 CSS Assetic 资产放在 DefaultBundle 中，但我认为放置它们的最佳位置是 app/Resources/public/(js|css) 文件夹中。

另外，参考我们使用的资产：

% javascripts filter="" output="js/core.js" debug=true
    "@DefaultBundle/Resources/public/js/jquery-1.6.2.js" %
    <script src=" asset_url " type="text/javascript"></script>
% endjavascripts %

如何在 app/Resources/public/... 中引用 jQuery 和我的 CSS 重置样式表等共享资产？

【参考方案1】：

你也可以这样用：

% stylesheets '../app/Resources/public/css/*' %
    <link href=" asset_url " type="text/css" rel="stylesheet" />
% endstylesheets %

【讨论】：

这比把东西保存在公用文件夹中要好得多，这也是我整晚都在挠头的事情！谢谢！

有没有办法可以将其扩展到 app/Resources/public/images 中的图像？

我相信您可以使用类似于 % stylesheets % % endstylesheets % 的 % image % % endimage % 块

这将按字母顺序加载文件，但是如何强制按我自己的顺序加载文件？

您可能需要单独指定每个资产来控制顺序，您可以使用特殊的文件命名来获得特定的输出顺序。这是相当老的帖子，我建议查看symfony.com/doc/current/cookbook/assetic/asset_management.html 以获取更多最新信息。我鼓励人们查看命名资产部分，以了解最佳实践和易于管理。

【参考方案2】：

是的，不将库放在 Bundle 中是一个不错的选择

请看这里：http://symfony.com/doc/current/cookbook/bundles/best_practices.html#vendors

捆绑包不应嵌入以 JavaScript、CSS 或任何其他语言编写的第三方库。

---

我建议您将 jquery 和重置文件置于类似以下内容：app/Resources/public/js/jquery.min.js 并使用以下内容更改您的代码：

% javascripts filter="" output="js/core.js" debug=true
    "../app/Resources/public/js/jquery-1.6.2.js" %
    <script src=" asset_url " type="text/javascript"></script>
% endjavascripts %

我希望这对你有用。

编辑：将答案编辑为https://***.com/a/9237004/505836，谢谢大卫。

【讨论】：

我希望将脚本放在非公共文件夹中，但这很有帮助，感谢您的回答。

将javascript文件放在非公共文件夹中是没有用的，因为该文件将由客户端浏览器下载然后是公共的；）

不不不，这不是资产的方式！ Assetic 的目的是在生产环境中提供原始文件或编译文件。如果您的 JS 文件不应该被直接访问，请不要将它放在 web 文件夹中，它会出现两次（您放置的原始文件和资产输出）。相反，将其放到“app/Resources/public/js/jquery-1.6.2.js”并传递资产这个路径。

【参考方案3】：

我的解决方案与 David 的几乎相同，但使用 %kernel.root_dir% 而不是硬编码 app 文件夹（尽管我怀疑很多人会更改此文件夹的名称），例如：

%- javascripts output='compiled/main.js'
    '%kernel.root_dir%/Resources/public/js/jquery-1.10.2.min.js'
    '%kernel.root_dir%/Resources/public/js/underscore-1.5.2.min.js'
    '@MyOwnBundle/Resources/public/js/default.js'
-%
    <script src=' asset_url '></script>
%- endjavascripts %

如果第三方库引用他们自己的资产（例如，通常是 img 子文件夹中的图像，从 .css 文件中引用），通常在服务器上创建相应的符号链接就足够了，例如ln -s .../app/Resources/public/img .../web/img 或类似的东西。当然，或者使用 cs-s-rewrite 过滤器 - 但要注意它的警告。

（另外，请注意我不使用type="<mime-type>" 属性，因为文件的内容类型无论如何都在HTTP 标头中提供。）

【讨论】：

我最喜欢这个答案。

【参考方案4】：

您可以将../app/Resources/public/css/ 替换为public/css/。 Javascript 文件夹也是如此。

% stylesheets filter='less' output='css/core' 'public/css/*' %

      <link href=" asset_url " type="text/css" rel="stylesheet" />

% endstylesheets %

% javascripts "public/js/*" %

      <script src=" asset_url " type="text/javascript"></script>

% endjavascripts %

这里会自动加载/web/public文件夹的所有文件。