Assetpack creates wrong aliases

[YVeselovskyi]

This is my folders structure, it was working on 0.8.0 version, but now, when assets are built it ignores the fact, that they are inside folders and makes an alias with just their file names, like instead of animations/water in packed json it is water.

my config:

nameStyle: 'relative' - this is not working at all, no matter where I put it.

how can I fix it?

Thanks!

[Zyie]

Hey the config here looks a little off, can you try this

import { pixiPipes } from "@assetpack/core/pixi";

export default {
  entry: './raw-assets',
  output: './public',
  pipes: [
    ...pixiPipes({
        texturePacker: { nameStyle: "relative" },
        manifest: { output: './src/manifest.json' }
    }),
  ],
};

[YVeselovskyi]

I tried all variants, it still ignores :(

[Zyie]

ok yeah i can recreate this

will take a look!

[Zyie]

@YVeselovskyi I've got a PR to fix the issue, if you want an immediate solution try turning removeFileExtension: false

[YVeselovskyi]

@Zyie thanks! also fonts are not working, I have a fonts folder, they are converting to woff2, but pixi.js does not recognize them at all.

[Zyie]

fonts are not working

Yeah this is a known issue with cache busting and fonts, just turn that off for now

export default {
  pipes: [
    ...pixiPipes({
        cacheBust: false
    }),
  ],
};

Will be fixing this issue fairly soon

[antag0n1st]

The aliases are not generated correctly for some of the bundles.

In this example you can see how the names are correctly trimmed in one of the bundles , but it stops the trimming process for the other bundles.

here is my config

import { pixiManifest } from "@assetpack/core/manifest";
import { compress } from "@assetpack/core/image";

export default {
  entry: "./assets",
  output: "./public/assets",
  cache: true,
  cacheLocation: ".assetpack",
  pipes: [
    ...pixiPipes({
      // TODO can't be used, because it attaches a hash after the file name
      // but we load the SOUNDS by name...
      cacheBust: false,
      texturePacker: {
        texturePacker: {
          removeFileExtension: true,
          nameStyle: "short",
        },
      },
      resolutions: { default: 1, low: 1 },
    }),
    pixiManifest({
      output: "manifest.json",
      createShortcuts: true,
      trimExtensions: true,
      includeMetaData: true,
    }),
    compress({
      jpg: false,
      png: false,
      webp: { quality: 80, alphaQuality: 80 },
      avif: false,
    }),
  ],
};

Here is the folder structure

please , help

[Zyie]

please , help

Hey @antag0n1st do you by chance have two or more files named logo_jili? The manifest removes any name clashes

[antag0n1st]

@Zyie
yes that was the problem , thank you for pointing that. Is it possible that assetpack can log a warning for this ?

[antag0n1st]

@Zyie actually I need to have them with duplicate names. As I want to load language dependent assets in different language bundles.

for example en{m}/title.png de{m}/title.png

and It will be a different title based on the language.

[YVeselovskyi]

@Zyie hello! when you will be able to merge that PR with fix?

[sarahgaucimizzi]

@Zyie Using latest 1.1.1 with this config:

import { pixiPipes } from '@assetpack/core/pixi'

export default {
  entry: './raw-assets',
  output: './public/assets/',
  pipes: [
    ...pixiPipes({
      cacheBust: true,
      texturePacker: {
        texturePacker: {
          nameStyle: 'relative'
        }
      }
    })
  ]
}

I still get this warning and this output

Like the scenario mentioned above with the languages, I want them to have identical names but distinguished by their path/folder name to use landscape and portrait assets in the respective scenario.

Am I missing something else in the config?

[Zyie]

Hey @sarahgaucimizzi

Can you provide me with your folder structure layout so i can see if i can recreate the error?

If you cant provide a screenshot then this tool is very useful: Tree

[sarahgaucimizzi]

Hi thanks for the quick response, this is a screenshot of the folder structure with the issue being about test_banner.png (the rest of the assets are fine)

Since posting I also tried with texture packer pipe instead of the pixiPipe just incase but still same issue

import { audio } from '@assetpack/core/ffmpeg'
import { json } from '@assetpack/core/json'
import { pixiManifest } from '@assetpack/core/manifest'
import { texturePacker } from '@assetpack/core/texture-packer'
import { webfont } from '@assetpack/core/webfont'
// import { pixiTexturePacker } from '@assetpack/plugin-texture-packer'

export default {
  entry: './raw-assets',
  output: './public/assets/',
  // cache: false,
  pipes: [
    json(),
    webfont(),
    audio(),
    texturePacker({
      texturePacker: {
        nameStyle: 'relative',
        removeFileExtension: true
      }
    }),
    pixiManifest({
      output: './public/assets/assets-manifest.json'
    })
    // ...pixiPipes({
    //   cacheBust: false,
    //   // texturePacker: {
    //   //   texturePacker: {
    //   //     removeFileExtension: true,
    //   //     nameStyle: 'relative'
    //   //   }
    //   // }
    // })
  ]
}

[Zyie]

ahh ok, I think I need to introduce another naming strategy that includes the folder name that has the {tps} tag on it. The 'relative' strategy only takes the folder structure inside the {tps} into account.

assets
└── mobile{m}
    ├── landscape{tps}
    │   └── landscape
    │       └── test_banner.png
    └── portrait{tps}
        └── portrait  
            └── test_banner.png

so in this example the names would be portrait/test_banner.png and landscape/test_banner.png

[sarahgaucimizzi]

I see, sorry did not understand this from the docs, to resolve the warning I had to separate again mobile and desktop since they both have landscape.

and the output is what I expect thanks 🙏