Using tsconfig-paths allows static imports, but it does not recognize baseUrl
. Use @/
as an alias for the root directory as such:
import Component from '@/Components/Component'
Using Vite with the dynamic import plugin for rollup requires dynamic imports to be explicitly defined by path depth and must end with a file extension:
// Not allowed
import(bar)
import(`${bar}.js`)
import(`/foo/${bar}.js`)
import(`some-library/${bar}.js`)
// allowed
import(`./foo/${bar}.js`)
The dynamic imports for Inertia have been explicitly defined in app/frontend/dynamicImports.ts
to adhere to these requirements, which imposes specific constraints on folder structure in the Pages directory.
- All entrypoints must be an
index.tsx
file in a directory named for the route - Maximum depth of 3 folder levels for any page entrypoint
Use to increase log depth for server side node output for debugging webpack:
const util = require('util')
console.log(util.inspect(myObject, {showHidden: false, depth: null, colors: true}))
// alternative shortcut
console.log(util.inspect(myObject, false, null, true /* enable colors */))