【问题标题】:Sailsjs disable a single jsSailsjs 禁用单个 js
【发布时间】:2013-06-25 16:06:26
【问题描述】:

现在,我正在使用<%- assets.js() %> 来包含所有页面上的所有 javascript 文件。因此,这意味着将在所有页面上初始化所有功能。

我想知道如何禁用特定网页上的 javascript 文件?或者,如果有办法在特定网页上包含一些 javascript 文件,而不是所有 javascript 文件。

【问题讨论】:

  • 我想先说我刚刚开始使用 Sailsjs。您可以控制在 myProject/config/assets.js 中下载哪些目录。但是,这将适用于所有页面。您是否考虑过在部分中使用

标签: sails.js


【解决方案1】:

自动加载的问题在于,很难以任何有意义的方式规定源文件的顺序——这实际上取决于您如何构建前端。

在 v0.8.x(据我所知,您正在使用的版本)中,您可以使用 config/assets.js 来控制加载文件夹的顺序。这并不理想,但我的团队在多个项目中使用的不错的解决方法。

在 v0.9 中,我们删除了 rigging/asset-rack 以支持紧密集成 Grunt,它有一个庞大的社区和一些非常酷且维护良好的软件包,用于大多数类型的资产捆绑等。

在任何情况下,您都可以研究以下不同方法来在新版本的 Sails.js 中提供资产:

  1. 像对待其他任何事情一样对待它

    在您的layout.ejs 文件中,创建<link /><script></script> 标记以像往常一样链接到您的css 和javascript 文件中。

  2. 使用 AMD (Require.JS)

    我想很多人会说这实际上是最好的选择。 Require 是一个非常强大的工具。而且我基本上同意——如果你正在使用可能来自任何地方的前端 javascript,并且将由可能使用不同框架的其他开发人员扩展,那么 AMD 是一个很好的方法确保你保持安全。如果你使用 Require,每个 js 文件都是它自己的模块,并声明自己的依赖关系,因此资产依赖管理成为过去。然后在生产模式下,有几个不同的选项来编译和缩小你的 CSS 和 JS。您甚至可以使用 Require 从 JS 动态加载模板和 CSS,这非常简洁。如果您对异步加载部分或全部资产感兴趣,AMD/RequireJS 无疑是赢家。它也是一个全客户端解决方案,非常酷。

    我认为唯一的缺点是复杂性。如果您可以控制所使用的框架,那么您真的不必为每个文件手动输入依赖项——它可以自己解决(参见https://github.com/balderdashy/mast/blob/2.x/lib/raise.js

  3. 使用咕噜声

    当您在 Sails v0.9 中使用 sails new foo 创建一个新项目时,会创建一个名为 Gruntfile.js 的文件。它里面有很多东西,其中很多都没有被默认使用。你几乎可以用 Grunt 做任何事情,但特别是,你会想看看它是如何设置将文件从 assets/* 复制到 .tmp/public/ 的。

  4. sails new foo --linker(仅限 Sails v0.9)

    链接器很像当前的资产架/索具。它创建了与上面 #3 相同的 Gruntfile,但使用了更多的内容。它将按照您指定的顺序自动链接文件。 scriptlinker 插件允许您自定义将注入 js、css 和模板的分隔符,而不是视图部分(例如 <%= %>)。默认情况下,Gruntfile 设置为使用 JST 预编译模板,但同样,您可以随意设置。

希望对大家有所帮助,祝你好运!

-迈克

PS- v0.9 即将发布,我一直在通过测试和问题来确保我们 100% 成功。如果您想尝试一下,请查看:

https://gist.github.com/mikermcneil/5930330

【讨论】:

  • 如何将requirejssailsjs 一起使用?我在尝试将<script data-main="../assets/js/require_main.js" src="../assets/js/vendor/require-js/require.js"></script> 添加到layout.ejs 文件时收到404
  • @user2503775 您需要将assets 视为您的根目录(更多内容请参见the docs)。所以在你的例子中:<script data-main="js/require_main.js" src="js/vendor/require-js/require.js"></script>
【解决方案2】:

Sailsjs 的负责人回复了这个问题(虽然是关于选择 CSS 文件):

“现在,您可以 (a) 一直引入所有样式并只应用相关样式 (b) 使用其他工具(如 Grunt)来捆绑资产,就像在 vanilla node.js 项目中一样,或者(c) 手动链接样式表(将它们放在您的公用文件夹中)。”

见:choosing assets sailsjs

Google 小组中提出了类似的、更复杂的问题: https://groups.google.com/forum/#!topic/sailsjs/yt9EpJlfzXA

考虑到上述情况,您可能希望每个页面都有一个单独的 layout.ejs。您可以使用

为每个页面指定所需的layout.ejs
res.view({ layout: "different_layout" })

layout.ejs 将 (a) 不调用 assets.js() 而是为所有需要的 js 文件提供

【讨论】:

  • 一般来说,我尽量不干涉资产管理和利用人们已经习惯的解决方案。我们即将进入我们的第三个资产管理库,这是一个非常困难的问题,要以一种让每个人都满意的方式来解决。我很高兴与 Grunt 社区合作开发软件包,并为使用不同类型资产管理的人们编写教程(例如链接器教程,requirejs 教程)同时,像这样的答案和像 @junv 的问题是一个巨大的为社区提供帮助。谢谢!
【解决方案3】:

我有一个 assets.js() 的包装器,它允许您包含除指定文件之外的所有资产。您还可以使用它在其他地方仅包含特定资产。因此,您可以在布局中加载常用资产,并仅在需要它们的页面上包含其他资产。

查看我对How can I include javascript assets selectively in SailsJS?的回复

【讨论】:

    猜你喜欢
    • 2020-07-26
    • 1970-01-01
    • 1970-01-01
    • 2017-03-24
    • 2011-07-11
    • 2011-09-13
    • 2017-05-31
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多