Skip to content

devvit create icons uses backslash in asset names on Windows #129

@PitchforkAssistant

Description

@PitchforkAssistant

When using the devvit create icons command, the name of the asset is its relative path to the assets directory. This results in the generation of assets with an escape sequence in their name in the final TS file.

As an example, consider the following assets folder structure on Windows:

assets/
    subDirectory/
        vectorLogo.svg

Running devvit create icons on Windows will result in this icons.ts file:

// This file is auto-generated by `devvit create icons`. Do not edit it directly.
import {svg} from "@devvit/public-api";

export const Icons = {
  "subDirectory\vectorLogo.svg": svg`<svg/>`
} as const;

This behavior is expected from path.relative used to get the name:

const name = path.relative(assetsPath, asset);

Then backslash is in fact escaped there, but becomes unescaped when writing the SVGs to the icons TS file. I think the best solution would be to replace the backslashes with forward slashes, mimicking the behavior of tinyglob and making sure asset names are the same regardless of which platform you create them on.

TLDR: const name = path.relative(assetsPath, asset); should probably be const name = path.relative(assetsPath, asset).replaceAll(path.sep, '/');

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions