找不到.json文件（Node.js NPM游戏编程）

Question

我正在尝试使用 NPM 在我的画布上绘制瓷砖，我成功地做到了。我制作了一个json文件来尝试存储每个级别的tile数据并尝试加载它。但是，它给了我一个 404 not found 错误，并且当我在 Chrome 上检查它时，“levels”文件夹没有出现在源下。

不知道我做错了什么。这是 main.js 的代码：

import SpriteSheet from './SpriteSheet.js';

import {loadImage, loadLevel} from './loaders.js';

const canvas = document.getElementById('screen');

const context = canvas.getContext('2d');

context.fillRect(0, 0, 50, 50);

loadImage('/img/tiles.png')

.then(image => {

    const sprites = new SpriteSheet(image, 16, 16);

    sprites.define('ground', 0, 0);

    sprites.define('sky', 3, 23);

    loadLevel('1-1')

    .then(level => {

        console.log(level);

    });

    for (let x = 0; x < 25; ++x){

        for (let y = 0; y < 14; ++y){

            sprites.drawTile('sky', context, x, y);

        }

    }

    for (let x = 0; x < 25; ++x){

        for (let y = 12; y < 14; ++y){

            sprites.drawTile('ground', context, x, y);

        }

    }

});

对于 loader.js：

export function loadImage(url){

    return new Promise(resolve => {

        const image = new Image();

        image.addEventListener('load', () => {

            resolve(image);

        });

        image.src = url;

    });

}

export function loadLevel(name){

    return fetch('/levels/${name}.json')

    .then(r => r.json());   

}

和 1-1.json：

{

    "backgrounds": [

        {

            "tile": "sky",

            "ranges": [

                [

                    0, 25,

                    0, 14

                ]

            ]

        }

    ]

}

我附上了我的文件夹的图像以防万一。img 包含我正在使用的 tile img，js 有 main.js 和 loaders.js，而级别只有 1-1。

Answer 1

您必须使用背打勾在（``）而不是单引号return fetch('/levels/${name}.json')是return&nbsp;fetch(`/levels/${name}.json`)有关更多信息，请查找 Javascript模板字符串

Answer 2

你试过loadImage('../img/tiles.png')吗？