在Stylus和Node.js和Express中使用本地图像是否可行?
这里的情况是:我想在我的Web应用程序中使用图像,在Stylus文件( style.styl
)中使用下面的代码来设置图像:
.background background: url(http://path/to/image)
但是,将图像保存到我的本地应用程序目录是可行的,并从目录内使用它?
我的目录结构如下所示:
app.js package.json public css style.styl js images image.png views routes
我想从style.styl
文件中使用图像,然后在我的应用程序中有人访问特定的路由时,在我的应用程序中parsing和使用该图像。
但是,下面的代码根本不起作用:
.background background: url(../images/image.png)
另外下面的代码不起作用
.background background: url(./public/images/image.png)
那么,我怎样才能在我的应用程序从本地目录中使用图像?
我得到了这个页面,但是我根本无法理解所有的东西。 特别是,我应该在哪里写代码在页面上? 它看起来像没有被认为是写在style.styl
,这只是一个手写笔文件,据我所知,而不是一个JavaScript文件。 另外,我应该在callback函数中写什么?
当我在app.js
写上面的代码的时候,我得到了一个错误: str is not defined
,因为stylus(str)
意味着我定义了一个str
对象,我不这样做。 所以我不确定它是怎么做的…
我在./public/css/
目录中使用我的Stylus文件,并写入app.use(require("stylus").middleware(path.join(__dirname, "public")));
在我的app.js. 另外,我使用Express 3.5.1。
这可能会有帮助(从http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7c44a.html – 请不要使用Dreamweaver):
有三种types的链接path:
Absolute paths (such as http://www.adobe.com/support/dreamweaver/contents.html). Document-relative paths (such as dreamweaver/contents.html). Site root–relative paths (such as /support/dreamweaver/contents.html).
在express.js应用程序中,公用文件夹充当站点根目录。