3

在 Sails.js 应用程序中，如何选择性地包含 javascript 资产？

例如，如果我有一个管理页面并且 admin.js 位于 assets/js 目录中。如何防止 admin.js 在公共索引页面上加载？

我知道我可以将 js 移出公共目录，并将脚本包含在我的管理视图模板中。但是在assets.js()调用插入它的 javascript之后，我仍然无法包含它。我需要在sails.io.js脚本加载后插入它。

有没有办法选择性地加载脚本并且仍然可以访问自动包含在assets.js ()函数调用中的sails.io.js？这种情况有更好的范例吗？

编辑：

由于 SailsJS 0.9 的发布和资产管理系统的重组，这个问题不再适用。

4

6 回答 6

1

在 Sails.js 应用程序中，如何选择性地包含 javascript 资产？

我使用 assets.js() 周围的包装器选择性地加载 js 资产。此片段使用 Jade 的“-”和“！{...}”。EJS 将改为使用“<%...%>”和“<%=...%>”

<!-- JavaScript and stylesheets from your assets folder are included here -->
!{assets.css()}
-function selectAssets (assetsjs, files, ifInclude) {
-  return assetsjs.split('\n').reduce(function (prev, curr, i) {
-    var frag = curr.match(/src="\/assets\/js\/\w{1,}\-/);
-    if(frag) {
-      var file = frag[0].substring(16, frag[0].length - 1);
-      if ((files.indexOf(file) === -1) == ifInclude) { return prev; }
-   }
-   return prev + curr + '\n';
-  }, '');
-}
//!{assets.js()} this line is replaced by:
!{selectAssets(assets.js(), ['dummy1', 'dummy5', 'dummy6'], false)}

以上内容不包括 /assets/js/dummy1.js, dummy5,​​ dummy6 的布局。如果您想在特定页面上包含 dummy1 和 dummy5，您可以放置

!{selectAssets(assets.js(), ['dummy1', 'dummy5'], true)}

在那个页面上。

注意：代码假定文件名不包含“-”。它可以直接概括为 css 和模板。Sails-io 是 mixins 的一个特例。

于 2013-07-12T16:59:17.047 回答
1

Sailsjs 使用asset-rack 来服务/assets。使用默认布局页面，sailsjs 提供的页面看起来像（dummy2.js 包含在显式的 <script> 中）：

<html>
  <head>
    ...
    <script type="text/javascript" src="/assets/mixins/sails.io-d338eee765373b5d77fdd78f29d47900.js"></script>
    <script type="text/javascript" src="/assets/js/dummy0-1cdb8d87a92a2d5a02b910c6227b3ca4.js"></script>
    <script type="text/javascript" src="/assets/js/dummy1-8c1b254452f6908d682b9b149eb55d7e.js"></script>
  </head>
  <body>
    ...
    <script src="/public/dummy2.js"></script>
    ...
  </body>
</html>

所以sailsjs 不会连接文件（至少不是在开发模式下）。Sails.io (socket-io) 总是包含在布局中的 /assets/js 之前，以及页面上的 <script> 之前。

看起来您的 admin.js 正在等待sails.io 尚未设置的条件，也许它正在与服务器协商传输？尝试等待设置条件。

于 2013-07-11T22:06:04.863 回答
1

我知道这是一个老问题，但因为人们仍在寻找这个。

创建新项目后，Sails 在根目录中有一个名为 tasks 的文件夹。

您要查找的文件是

管道.js

该文件包含一个名为jsFilesToInject

// Client-side javascript files to inject in order
// (uses Grunt-style wildcard/glob/splat expressions)
var jsFilesToInject = [

  // Load sails.io before everything else
  // 'js/dependencies/sails.io.js',
  'js/sails.io.js'


  // Dependencies like jQuery, or Angular are brought in here
  'js/dependencies/**/*.js',

  // All of the rest of your client-side js files
  // will be injected here in no particular order.
  'js/**/*.js'
];

只需将要加载的脚本放在sails.io.js 之前。

这与sails 0.11.x 有关

另一种有效的方法是创建一个 views/partials 文件夹

并创建一个新文件，如 mapScripts.ejs 将脚本标签放在那里并在您的视图中使用

<% include ../partials/mapScripts %>
于 2015-12-20T14:00:27.223 回答
0

回答有关包含文件所在位置的部分问题。

在 0.10 版本中，文件的顺序是在文件中设置的，tasks/values/injectedFiles.js因为我记得在以前的版本中它Gruntfile.js本身是确定的。

于 2014-02-28T18:32:42.403 回答
0

是的，您在模板中添加了条件。:)

或为您的 js 添加另一个“块”。

extends ../layout

block body
    <h1>hello</h1>

block jsscripts
    <scripts> ..... </script>
于 2013-07-10T07:33:54.027 回答
0

您可以在 tasks/pipeline.js 中添加自定义文件的引用

var jsFilesToInject = [
  'js/dependencies/sails.io.js',
  'js/dependencies/**/*.js',
  'js/**/*.js',
  'js/yourcustomFile.js'
];
于 2017-06-02T05:35:02.613 回答