相关的路径是哪个上下文？

Question

这是一个死的简单问题，毫无疑问是重复的，但我已经四处寻找并且没有找到有效的答案。 （我也是Flex / Actionscript世界的难民，我仍然习惯了这个Javascript世界的奇怪习俗）

我正在测试Jimp图片库并使用Jimp示例（如下）。我在“js”目录中创建了一个新文件“jimpMethods.js”，并将Jimp示例包装在“testJimp”函数中。我想在我的项目的“assets”目录中引用“house.jpg”。我在“index.html”的脚本标记中引用了“jimpMethods.js”，并在窗口的“onLoad”事件中调用了“testJimp”。

我的问题：如何在资源文件夹中引用图像文件？脚本本身位于“JS”文件夹中，但它在封闭目录中的“index.html”内执行。

我试过了：

./assets/house.jpg  // this would be relative to the "index.html" 
 ../assets/house.jpg // this would be relative to the "JS" directory

都没有奏效。我尝试了多种变化，最后采用了

__dirname + '/assets/house.jpg'   

哪个确实有效（这是在Electron中，__dirname是一个全局var引用app文件夹）。

我想了解我以前的尝试中缺少的内容：根据我描述的目录结构，我的图像的正确相对路径是什么？

我在“JimpMethods.js

中的代码

var Jimp = require("jimp");

function testJimp() {
    var thePath =  __dirname + '/assets/house.jpg'

    Jimp.read(thePath, function (err, mmyImage) {
        if (err) throw err;
        mmyImage.resize(256, 256)            // resize
            .quality(60)                 // set JPEG quality
            .greyscale()                 // set greyscale
            .write(__dirname +  '/assets/house-small-bw.jpg'); // save
    });
}

最初的Jimp示例

var Jimp = require("jimp");

// open a file called "lenna.png"
Jimp.read("lenna.png", function (err, lenna) {
    if (err) throw err;
    lenna.resize(256, 256)            // resize
         .quality(60)                 // set JPEG quality
         .greyscale()                 // set greyscale
         .write("lena-small-bw.jpg"); // save
});

Answer 1

尝试

console.log(__dirname)

你会发现它不是你开始使用的index.html而是main.js.您必须从服务器的路径或程序的主脚本开始。在你的情况下，它是main.js.所以以下内容应该有效：

./app/assets/house.jpg

但是使用__dirname是一个很好的解决方案，更好的是使用path.join。