在SailsJS 0.9.7中手动包含资产 [英] Manually include assets in SailsJS 0.9.7

问题描述

我正在尝试在SailsJS中手动包含一些资产，但我无法让它们工作。它们保持404'。

I'm trying to manually include some assets in SailsJS, however I can't get them to work. They keep 404'ing.

config / routes.js评论告诉我，assets / images / 1.png中的图像可以通过 HREF = 图像/ 1.png。同样的事情似乎不适用于样式表，因为< link rel =stylesheethref =/ styles / style.css> 导致404没有发现。

The config/routes.js comments tell me that and image in assets/images/1.png would be accessible via href="images/1.png". The same thing doesn't seem to apply for stylesheets as <link rel="stylesheet" href="/styles/style.css"> results in a 404 not found.

我看到Sails最近使用了非常广泛的Grunt文件，但是我想要更多的控制权，所以我放弃了它。我知道打破资产的自动包括，但这也打破了手动插入？ :(

I saw that Sails uses a very extensive Gruntfile as of lately, but I wanted a bit more control so I ditched it. I know that breaks the automatic including of assets, but did that also break the manually insertion? :(

编辑：


我在文档中发现不再从资源文件夹中提供公共资产了，但是从.tmp / public文件夹。有没有办法可以改变这种行为，只使用assets /文件夹作为面向公众的目录？

I found in the documentation that public assets aren't served from the assets folder anymore, but from the .tmp/public folder. Is there a way I can change this behaviour and just use the assets/ folder as a public facing directory?

另一种选择是当然只是简单地使用Sails的Gruntfile方法，但它仍然会减少编译器错误，即使我使用 lessc 手动编译时，一切正常......

Another option would of course be to simply use Sails' Gruntfile approach, but it keeps throwing less compiler errors even though when I compile things manually using lessc everything works fine...

推荐答案

如果删除 Gruntfile.js ，您的资产都不会被管理帆。

If you delete the Gruntfile.js, none of your assets will be managed by sails.

Sails使用 grunt 。这个管理的一部分涉及在项目文件夹结构和服务器的公共文件夹之间同步文件，但一如既往，我领先于我自己。

Sails uses grunt to manage assets. Some of this "management" involves syncing files between your project folder structure and the server's public folder, but as always, I'm getting ahead of myself.

grunt 的配置基于根目录中的 Gruntfile.js 文件你的帆项目。这个文件中有很多内容，但是，我将专注于javascript和css资产。

The configuration of grunt is based upon the Gruntfile.js file found in the root of your sails project. There’s a lot going on in this file, however, I’m going to concentrate on the javascript and css assets.

首次创建项目时，可以选择使用 - 链接器标志。使用该标志的一个示例是 sails new projectName --linker 。以下是两种情况下 / assets 文件夹的目录结构：

When you first create a project, you have the option of using the --linker flag. An example of using the flag would be sails new projectName --linker. Here’s the directory structure of the /assets folder under both scenarios:

USING - 链接器 flag

/assets
 /images
 /linker
  /js
  /styles
  /templates

不使用 - 链接器标志

/assets
 /images
 /js
 /styles

注意，您可以通过手动创建 / linker - linker 标志创建的项目c $ c>文件夹并将其插入 / assets 路径。然后，您可以添加 / js ， / styles 和 / templates / linker 。

Note, you can "upgrade" a project that wasn't created with the --linker flag by manually creating the /linker folder and inserting it into your /assets path. You can then add /js, /styles, and /templates under /linker.

通过 sails lift 启动sails服务器时，通过 grunt 创建/同步以下文件夹结构 .tmp 文件夹：

When starting the sails server via sails lift the following folder structure is created/sync'd via grunt within the .tmp folder:

.tmp
  /public

如果有任何其他项目文件夹（例如 / images ， / js ， / styles ， / templates ）包含将它们复制/同步到 .tmp / public 文件夹的内容。区别在于，如果存在 / linker 文件夹， / js ， / styles ，并在 / linker 下创建一个额外的 / templates 文件夹。

If any of the other project folders (e.g. /images, /js, /styles, /templates) contain content they are copied/sync'd to the .tmp/publicfolder. The distinction being that if a /linker folder exists, the /js, /styles, and an additional /templates folder is created under /linker.

如果您使用 / linker 文件夹，sails将更改您的 layout.ejs 文件以包含指向您的JavaScript的链接和css文件。因此，从项目的 / views 文件夹中提供的任何页面都可以访问这些文件中包含的javascript和css。

If you use the /linker folder, sails will alter your layout.ejs file to include links to your javascript and css files. Therefore, any page served from the project's /views folder will have access to the javascript and css contained in these files.

Grunt使用 layout.ejs 中的注释标签作为这些链接的placehodler。例如，放在 / style 文件夹中的任何内容都将自动链接到这两个标记之间的 layout.ejs 中：

Grunt uses commented tags in layout.ejs to as placehodler for these links. For example, anything placed in the /style folder will automatically be linked in layout.ejs between these two tags:

<!--STYLES-->    
<!--STYLES END-->

/ js 文件夹中的任何内容都将是在这两个标签之间链接：

Anything in the /js folder will be linked between these two tags:

<!--SCRIPTS-->
<!--SCRIPTS END-->

/ templates 文件夹中的任何内容都将是在这两个标签之间链接：

Anyting in the /templates folder will be linked between these two tags:

<!--TEMPLATES-->   
<!--TEMPLATES END-->

访问Sail的资产

这是你的方式在任一情况下访问资产：

Accessing Sail's Assets

Here's how you access the assets under either scenario:

使用 / linker 文件夹

/ js - > /linker/js/yourFile.js

/ styles - > /linker/styles/yourCSS.css

不使用 / linker 文件夹

/ js - > /js/yourFile.js

/ styles - > /styles/yourCSS.css

这篇关于在SailsJS 0.9.7中手动包含资产的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！