unbundle + import from parent folder: Invalid substitution "../x" for placeholder "[name]" in "output.chunkFileNames" pattern, can be neither absolute nor relative path

[milahu]

"import from parent folder" is a common pattern in the demo/ folder of a project

probably this is a "wontfix" because all solutions can be wrong (filepath collisions)

index.js

import { f } from "../index.js"

error

Invalid substitution "../index" for placeholder "[name]" in "output.chunkFileNames" pattern, can be neither absolute nor relative path.

repro https://github.com/milahu/vite-plugin-chunk-split-repro

cd $(mktemp -d)
git clone https://github.com/milahu/vite-plugin-chunk-split-repro
cd *
npm install
npm run build

vite.config.js

import { defineConfig } from "vite"
import path from 'path'
import { chunkSplitPlugin } from 'vite-plugin-chunk-split'

const assetsDir = '';
const outputDefaults = {
  // remove hashes from filenames
  entryFileNames: `${assetsDir}[name].js`,
  // Invalid substitution "../index" for placeholder "[name]" in "output.chunkFileNames" pattern, can be neither absolute nor relative path.
  chunkFileNames: `${assetsDir}[name].js`,
  assetFileNames: `${assetsDir}[name].[ext]`,
}

export default defineConfig({
  base: "./",
  clearScreen: false,
  build: {
    outDir: path.resolve('../docs'),
    emptyOutDir: true,
    target: 'esnext',
    minify: false,
    rollupOptions: {
      output: {
        ...outputDefaults,
      }
    },
  },
  plugins: [
    chunkSplitPlugin({
      strategy: 'unbundle',
    })
  ],
})

workarounds

const assetsDir = '';
const outputDefaults = {
  // remove hashes from filenames
  entryFileNames: `${assetsDir}[name].js`,

  // import from parent folder
  // https://github.com/sanyuan0704/vite-plugin-chunk-split/issues/16
  // Invalid substitution "../index" for placeholder "[name]" in "output.chunkFileNames" pattern, can be neither absolute nor relative path.
  //chunkFileNames: `${assetsDir}[name].js`,
  // workarounds ...
  chunkFileNames: (file) => {
    //console.dir(file.name); throw new Error("x");
    // Invalid pattern ".._index.js" for "output.chunkFileNames", patterns can be neither absolute nor relative paths. If you want your files to be stored in a subdirectory, write its name without a leading slash like this: subdirectory/pattern.
    //return file.name.replace(/\//g, "_") + ".js" // docs/.._index.js
    //return file.name.replace(/\//g, "_").replace(/^\./, "+") + ".js" // docs/+._index.js
    //return file.name.replace(/\.\.\//g, "_") + ".js" // docs/_index.js
    return file.name.replace(/\.\.\//g, ".parent/") + ".js" // docs/.parent/index.js
  },

  assetFileNames: `${assetsDir}[name].[ext]`,
}