Path Aliases

~/ and @/ resolve to the folder of the entry file. With kirbyup src/index.js, both point at src.

.
├─ src
│  ├─ components
│  │  └─ fields
│  │     └─ MyField.vue
│  └─ utils
│     └─ index.js

Inside src/components/fields/MyField.vue:

import { myFunction } from '../../utils'
import { myFunction } from '~/utils'

IDE Support

The editor does not know the aliases. A jsconfig.json (or tsconfig.json) in the plugin root enables jump-to-definition and autocompletion:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "~/*": ["src/*"],
      "@/*": ["src/*"]
    }
  },
  "include": ["src/**/*"]
}

Custom Aliases

Add more through the alias key of the config file, and mirror them in jsconfig.json.