@remix-run/assets 0.3.0 → 0.4.1

package/src/lib/routes.ts

@@ -1,4 +1,6 @@
 import { RoutePattern } from '@remix-run/route-pattern'
+import { createHref } from '@remix-run/route-pattern/href'
+import { createMatcher, type Matcher } from '@remix-run/route-pattern/match'
 
 import {
   getRelativeFilePath,
@@ -21,7 +23,9 @@ interface RouteConfig {
 interface CompiledRoute {
   rootDir: string
   urlPattern: RoutePattern
+  urlMatcher: Matcher
   filePattern: RoutePattern
+  fileMatcher: Matcher
 }
 
 export interface CompiledRoutes {
@@ -67,9 +71,9 @@ export function compileRoutes(
       let normalizedPathname = normalizePathname(pathname)
 
       for (let route of compiledRoutes) {
-        let match = route.urlPattern.match(`http://remix.run${normalizedPathname}`)
+        let match = route.urlMatcher.match(`http://remix.run${normalizedPathname}`)
         if (!match) continue
-        let relativeFilePath = route.filePattern.href(match.params).replace(/^\/+/, '')
+        let relativeFilePath = createHref(route.filePattern, match.params).replace(/^\/+/, '')
         return resolveFilePath(route.rootDir, relativeFilePath)
       }
 
@@ -80,9 +84,9 @@ export function compileRoutes(
 
       for (let route of compiledRoutes) {
         let relativeFilePath = getRelativeFilePath(route.rootDir, normalizedFilePath)
-        let match = route.filePattern.ast.pathname.match(relativeFilePath)
+        let match = route.fileMatcher.match(`http://remix.run/${relativeFilePath}`)
         if (!match) continue
-        return normalizePathname(route.urlPattern.href(getPathnameParams(route.filePattern, match)))
+        return normalizePathname(createHref(route.urlPattern, match.params))
       }
 
       return null
@@ -104,8 +108,8 @@ function compileRoute(
   )
   let filePatternSource = normalizeFilePattern(route.filePattern)
 
-  let urlPattern = new RoutePattern(urlPatternSource)
-  let filePattern = new RoutePattern(filePatternSource)
+  let urlPattern = RoutePattern.parse(urlPatternSource)
+  let filePattern = RoutePattern.parse(filePatternSource)
 
   validateNoUnnamedWildcards(urlPattern, 'URL')
   validateNoUnnamedWildcards(filePattern, 'File')
@@ -114,37 +118,30 @@ function compileRoute(
   return {
     rootDir: normalizeFilePath(options.rootDir).replace(/\/+$/, ''),
     urlPattern,
+    urlMatcher: createMatcher(urlPattern),
     filePattern,
+    fileMatcher: createMatcher(stripDotSegments(filePatternSource)),
   }
 }
 
-function getPathnameParams(
-  pattern: RoutePattern,
-  match: Array<{ name: string; type: ':' | '*'; value: string }>,
-): Record<string, string | undefined> {
-  let params: Record<string, string | undefined> = {}
+function stripDotSegments(pattern: string): string {
+  let segments: string[] = []
 
-  for (let param of pattern.ast.pathname.params) {
-    if (param.name === '*') continue
-    params[param.name] = undefined
-  }
-
-  for (let param of match) {
-    if (param.name === '*') continue
-    params[param.name] = param.value
+  for (let segment of pattern.split('/')) {
+    if (segment === '' || segment === '.') continue
+    if (segment === '..') {
+      segments.pop()
+      continue
+    }
+    segments.push(segment)
   }
 
-  return params
+  return segments.join('/')
 }
 
 function validateRoutePatterns(urlPattern: RoutePattern, filePattern: RoutePattern): void {
-  let urlParams = urlPattern.ast.pathname.params.map(
-    (param: { name: string; type: ':' | '*' }) => `${param.type}:${param.name}`,
-  )
-  let fileParams = filePattern.ast.pathname.params.map(
-    (param: { name: string; type: ':' | '*' }) => `${param.type}:${param.name}`,
-  )
-
+  let urlParams = getPathnameParams(urlPattern)
+  let fileParams = getPathnameParams(filePattern)
   if (urlParams.length !== fileParams.length) {
     throw new Error(
       `Route patterns must have matching capture structure.\nURL: ${urlPattern}\nFile: ${filePattern}`,
@@ -152,7 +149,9 @@ function validateRoutePatterns(urlPattern: RoutePattern, filePattern: RoutePatte
   }
 
   for (let i = 0; i < urlParams.length; i++) {
-    if (urlParams[i] !== fileParams[i]) {
+    let urlParam = urlParams[i]
+    let fileParam = fileParams[i]
+    if (urlParam.type !== fileParam.type || urlParam.name !== fileParam.name) {
       throw new Error(
         `Route patterns must have matching capture structure.\nURL: ${urlPattern}\nFile: ${filePattern}`,
       )
@@ -161,13 +160,17 @@ function validateRoutePatterns(urlPattern: RoutePattern, filePattern: RoutePatte
 }
 
 function validateNoUnnamedWildcards(pattern: RoutePattern, label: string): void {
-  if (
-    pattern.ast.pathname.params.some(
-      (param: { name: string; type: ':' | '*' }) => param.type === '*' && param.name === '*',
-    )
-  ) {
+  if (pattern.pathname.tokens.some((token) => token.type === '*' && token.name === '*')) {
     throw new Error(
       `${label} route patterns must use named wildcards for reversible mapping.\nPattern: ${pattern}`,
     )
   }
 }
+
+type PathnameParam = Extract<RoutePattern['pathname']['tokens'][number], { type: ':' | '*' }>
+
+function getPathnameParams(pattern: RoutePattern): Array<PathnameParam> {
+  return pattern.pathname.tokens.filter(
+    (token): token is PathnameParam => token.type === ':' || token.type === '*',
+  )
+}

package/src/lib/scripts/compiler.ts

@@ -34,6 +34,7 @@ import { createTsconfigTransformOptionsResolver, transformModule } from './trans
 import type { ResolveModuleResult, TransformArgs, TransformedModule } from './transform.ts'
 import { ResolverFactory } from 'oxc-resolver'
 import type { EmittedAsset, EmittedModule } from './emit.ts'
+import { isBareImportSpecifier } from './specifiers.ts'
 
 type ScriptRecord = ModuleRecord<TransformedModule, ResolvedModule, EmittedModule>
 type ScriptStore = ModuleStore<TransformedModule, ResolvedModule, EmittedModule>
@@ -66,6 +67,7 @@ type ScriptCompilerOptions = {
   external: string[]
   fingerprintAssets: boolean
   isAllowed(absolutePath: string): boolean
+  isDenied(absolutePath: string): boolean
   minify: boolean
   onWatchDirectoriesChange?: (delta: { add: string[]; remove: string[] }) => void
   rootDir: string
@@ -117,8 +119,14 @@ export function createScriptCompiler(options: ScriptCompilerOptions): ScriptComp
     extensionAlias: resolverExtensionAlias,
     extensions: resolverExtensions,
     mainFields: ['browser', 'module', 'main'],
+    symlinks: false,
     tsconfig: 'auto',
   })
+  let resolveModulePathOptions = {
+    isAllowed: resolvedOptions.isAllowed,
+    isDenied: resolvedOptions.isDenied,
+    routes: resolvedOptions.routes,
+  }
   let resolveInFlightByCacheKey = new Map<string, Promise<ResolvedModule>>()
   let emitInFlightByCacheKey = new Map<string, Promise<EmittedModule>>()
 
@@ -138,7 +146,9 @@ export function createScriptCompiler(options: ScriptCompilerOptions): ScriptComp
   let resolveArgs: ResolveArgs = {
     isAllowed: resolvedOptions.isAllowed,
     isWatchIgnored,
-    resolveModulePath,
+    resolveModulePath(absolutePath) {
+      return resolveModulePath(absolutePath, resolveModulePathOptions)
+    },
     resolverFactory,
     routes: resolvedOptions.routes,
   }
@@ -253,7 +263,7 @@ export function createScriptCompiler(options: ScriptCompilerOptions): ScriptComp
   }
 
   function resolveServedScriptOrThrow(absolutePath: string): ResolveModuleResult {
-    let resolvedModule = resolveModulePath(absolutePath)
+    let resolvedModule = resolveModulePath(absolutePath, resolveModulePathOptions)
     if (!resolvedModule) {
       throw createAssetServerCompilationError(`File not found: ${absolutePath}`, {
         code: 'FILE_NOT_FOUND',
@@ -548,11 +558,19 @@ function shouldClearResolverCacheForFileEvent(filePath: string, event: ModuleWat
   return event !== 'change' || isPackageJsonPath(filePath) || isTsconfigPath(filePath)
 }
 
-function resolveModulePath(absolutePath: string): ResolveModuleResult | null {
+function resolveModulePath(
+  absolutePath: string,
+  options: {
+    isAllowed(absolutePath: string): boolean
+    isDenied(absolutePath: string): boolean
+    routes: CompiledRoutes
+  },
+): ResolveModuleResult | null {
+  let candidateIdentityPath = normalizeFilePath(absolutePath)
   let resolvedPath: string
 
   try {
-    resolvedPath = normalizeFilePath(fs.realpathSync(normalizeFilePath(absolutePath)))
+    resolvedPath = normalizeFilePath(fs.realpathSync(candidateIdentityPath))
   } catch (error) {
     if (isNoEntityError(error)) return null
     throw error
@@ -563,11 +581,32 @@ function resolveModulePath(absolutePath: string): ResolveModuleResult | null {
   }
 
   return {
-    identityPath: resolvedPath,
+    identityPath: getModuleIdentityPath(candidateIdentityPath, resolvedPath, options),
     resolvedPath,
   }
 }
 
+function getModuleIdentityPath(
+  candidateIdentityPath: string,
+  resolvedPath: string,
+  options: {
+    isAllowed(absolutePath: string): boolean
+    isDenied(absolutePath: string): boolean
+    routes: CompiledRoutes
+  },
+): string {
+  if (candidateIdentityPath === resolvedPath) return resolvedPath
+  if (!containsNodeModulesPathSegment(candidateIdentityPath)) return resolvedPath
+  if (!options.routes.toUrlPathname(candidateIdentityPath)) return resolvedPath
+  if (!options.isAllowed(candidateIdentityPath)) return resolvedPath
+  if (options.isDenied(resolvedPath)) return resolvedPath
+  return candidateIdentityPath
+}
+
+function containsNodeModulesPathSegment(filePath: string): boolean {
+  return filePath.split('/').includes('node_modules')
+}
+
 function resolveActualPath(identityPath: string): string | null {
   try {
     return normalizeFilePath(fs.realpathSync(identityPath))
@@ -577,18 +616,6 @@ function resolveActualPath(identityPath: string): string | null {
   }
 }
 
-function isBareImportSpecifier(specifier: string): boolean {
-  return (
-    !specifier.startsWith('./') &&
-    !specifier.startsWith('../') &&
-    !specifier.startsWith('/') &&
-    !specifier.startsWith('file:') &&
-    !specifier.startsWith('data:') &&
-    !specifier.startsWith('http://') &&
-    !specifier.startsWith('https://')
-  )
-}
-
 function isNoEntityError(
   error: unknown,
 ): error is NodeJS.ErrnoException & { code: 'ENOENT' | 'ENOTDIR' } {

package/src/lib/scripts/resolve.ts

@@ -17,6 +17,7 @@ import { normalizeFilePath } from '../paths.ts'
 import type { CompiledRoutes } from '../routes.ts'
 import type { ResolveModuleResult, TransformedModule } from './transform.ts'
 import type { EmittedModule } from './emit.ts'
+import { isBareImportSpecifier } from './specifiers.ts'
 
 type ScriptRecord = ModuleRecord<TransformedModule, ResolvedModule, EmittedModule>
 
@@ -91,6 +92,11 @@ type NormalizedSpecifierResolution = {
   specifier: string
 }
 
+type SpecifierResolutionImporter = {
+  identityPath: string
+  resolvedPath: string
+}
+
 export async function resolveModule(
   record: ScriptRecord,
   transformed: TransformedModule,
@@ -105,7 +111,10 @@ export async function resolveModule(
       transformed.unresolvedImports.length > 0
         ? await batchResolveSpecifiers(
             getUniqueSpecifiers(transformed.unresolvedImports),
-            transformed.resolvedPath,
+            {
+              identityPath: transformed.identityPath,
+              resolvedPath: transformed.resolvedPath,
+            },
             args.resolverFactory,
           )
         : new Map<string, ResolvedSpec>()
@@ -196,8 +205,10 @@ export async function resolveModule(
     deps.add(resolvedImport.identityPath)
 
     if (transformed.packageSpecifiers.includes(unresolved.specifier)) {
-      let packageJsonPath =
-        resolvedSpec.packageJsonPath ?? findNearestPackageJsonPath(resolvedImport.resolvedPath)
+      let packageJsonPath = resolvePackageJsonPath(
+        resolvedSpec.packageJsonPath,
+        resolvedImport.resolvedPath,
+      )
       if (packageJsonPath && !args.isWatchIgnored(packageJsonPath)) {
         trackedFiles.add(packageJsonPath)
       }
@@ -235,6 +246,25 @@ export async function resolveModule(
   }
 }
 
+function resolvePackageJsonPath(
+  packageJsonPath: string | null,
+  resolvedPath: string,
+): string | null {
+  return (
+    (packageJsonPath ? resolveExistingPath(packageJsonPath) : null) ??
+    findNearestPackageJsonPath(resolvedPath)
+  )
+}
+
+function resolveExistingPath(filePath: string): string | null {
+  try {
+    return normalizeFilePath(fs.realpathSync(filePath))
+  } catch (error) {
+    if (isNoEntityError(error)) return null
+    throw error
+  }
+}
+
 function findNearestPackageJsonPath(filePath: string): string | null {
   let directory = path.dirname(filePath)
 
@@ -250,6 +280,17 @@ function findNearestPackageJsonPath(filePath: string): string | null {
   }
 }
 
+function isNoEntityError(
+  error: unknown,
+): error is NodeJS.ErrnoException & { code: 'ENOENT' | 'ENOTDIR' } {
+  return (
+    error instanceof Error &&
+    'code' in error &&
+    ((error as NodeJS.ErrnoException).code === 'ENOENT' ||
+      (error as NodeJS.ErrnoException).code === 'ENOTDIR')
+  )
+}
+
 function isRelativeImportSpecifier(specifier: string): boolean {
   return specifier.startsWith('./') || specifier.startsWith('../')
 }
@@ -326,7 +367,7 @@ function resolveCandidateBasePath(importerDir: string, specifier: string): strin
 
 async function batchResolveSpecifiers(
   specifiers: string[],
-  importerPath: string,
+  importer: SpecifierResolutionImporter,
   resolverFactory: ResolveArgs['resolverFactory'],
 ): Promise<Map<string, ResolvedSpec>> {
   let resolvedBySpecifier = new Map<string, ResolvedSpec>()
@@ -334,7 +375,7 @@ async function batchResolveSpecifiers(
 
   try {
     for (let specifier of specifiers) {
-      let normalizedResolution = normalizeSpecifierResolution(specifier, importerPath)
+      let normalizedResolution = normalizeSpecifierResolution(specifier, importer)
       let resolutionResult = await resolverFactory.resolveFileAsync(
         normalizedResolution.importerPath,
         normalizedResolution.specifier,
@@ -368,7 +409,7 @@ async function batchResolveSpecifiers(
     }
 
     throw createAssetServerCompilationError(
-      `Failed to resolve imports in ${importerPath}. ${formatUnknownError(error)}`,
+      `Failed to resolve imports in ${importer.identityPath}. ${formatUnknownError(error)}`,
       {
         cause: error,
         code: 'IMPORT_RESOLUTION_FAILED',
@@ -389,12 +430,12 @@ function formatUnknownError(error: unknown): string {
 
 function normalizeSpecifierResolution(
   specifier: string,
-  importerPath: string,
+  importer: SpecifierResolutionImporter,
 ): NormalizedSpecifierResolution {
   let authoredInjectedPackageSpecifier = restoreAuthoredInjectedPackageSpecifier(specifier)
   if (authoredInjectedPackageSpecifier) {
     return {
-      importerPath,
+      importerPath: getSpecifierImporterPath(authoredInjectedPackageSpecifier, importer),
       specifier: authoredInjectedPackageSpecifier,
     }
   }
@@ -407,11 +448,18 @@ function normalizeSpecifierResolution(
   }
 
   return {
-    importerPath,
+    importerPath: getSpecifierImporterPath(specifier, importer),
     specifier,
   }
 }
 
+function getSpecifierImporterPath(
+  specifier: string,
+  importer: SpecifierResolutionImporter,
+): string {
+  return isBareImportSpecifier(specifier) ? importer.resolvedPath : importer.identityPath
+}
+
 function getDisplayImportSpecifier(specifier: string): string {
   return restoreAuthoredInjectedPackageSpecifier(specifier) ?? specifier
 }

package/src/lib/scripts/specifiers.ts

@@ -0,0 +1,11 @@
+export function isBareImportSpecifier(specifier: string): boolean {
+  return (
+    !specifier.startsWith('./') &&
+    !specifier.startsWith('../') &&
+    !specifier.startsWith('/') &&
+    !specifier.startsWith('file:') &&
+    !specifier.startsWith('data:') &&
+    !specifier.startsWith('http://') &&
+    !specifier.startsWith('https://')
+  )
+}

package/src/lib/scripts/transform.ts

@@ -30,6 +30,7 @@ import { composeSourceMaps, rewriteSourceMapSources, stringifySourceMap } from '
 import type { EmittedModule } from './emit.ts'
 import type { ResolvedScriptTarget } from '../target.ts'
 import type { ResolvedModule } from './resolve.ts'
+import { isBareImportSpecifier } from './specifiers.ts'
 
 type ScriptRecord = ModuleRecord<TransformedModule, ResolvedModule, EmittedModule>
 
@@ -261,9 +262,9 @@ export async function transformModule(
                 content: sourceText,
               }),
         identityPath: record.identityPath,
-        importerDir: path.dirname(resolvedPath),
+        importerDir: path.dirname(record.identityPath),
         packageSpecifiers: analysis.unresolvedImports
-          .filter((unresolved) => isPackageImportSpecifier(unresolved.specifier))
+          .filter((unresolved) => isBareImportSpecifier(unresolved.specifier))
           .map((unresolved) => unresolved.specifier),
         rawCode: analysis.rawCode,
         resolvedPath,
@@ -299,10 +300,6 @@ function findNearestTsconfigPath(directory: string): string | null {
   }
 }
 
-function isPackageImportSpecifier(specifier: string): boolean {
-  return !specifier.startsWith('./') && !specifier.startsWith('../') && !specifier.startsWith('/')
-}
-
 async function analyzeModuleSource(
   sourceText: string,
   resolvedPath: string,

package/src/lib/styles/compiler.ts

@@ -44,7 +44,14 @@ type StyleGetOptions = {
 type StyleCompilerOptions = {
   buildId?: string
   fingerprintAssets: boolean
+  getServedFileUrl?(
+    identityPath: string,
+    options: {
+      transform: readonly string[] | null
+    },
+  ): Promise<string>
   isAllowed(absolutePath: string): boolean
+  isServedFilePath(filePath: string): boolean
   minify: boolean
   onWatchDirectoriesChange?: (delta: { add: string[]; remove: string[] }) => void
   rootDir: string
@@ -79,6 +86,7 @@ export function createStyleCompiler(options: StyleCompilerOptions): StyleCompile
   let emitInFlightByCacheKey = new Map<string, Promise<EmittedStyle>>()
   let resolveArgs: ResolveArgs = {
     isAllowed: resolvedOptions.isAllowed,
+    isServedFilePath: resolvedOptions.isServedFilePath,
     isWatchIgnored,
     routes: resolvedOptions.routes,
   }
@@ -248,6 +256,7 @@ export function createStyleCompiler(options: StyleCompilerOptions): StyleCompile
       let startedVersion = record.invalidationVersion
       let resolvedStyle = await getOrCreateResolvedStyle(record)
       let emitResolvedStyleResult = await emitResolvedStyle(resolvedStyle, {
+        getServedFileUrl: resolvedOptions.getServedFileUrl,
         getServedUrl,
         sourceMaps: resolvedOptions.sourceMaps,
       })

package/src/lib/styles/emit.ts

@@ -34,6 +34,12 @@ type EmitResult =
 export async function emitResolvedStyle(
   resolvedStyle: ResolvedStyle,
   options: {
+    getServedFileUrl?(
+      identityPath: string,
+      options: {
+        transform: readonly string[] | null
+      },
+    ): Promise<string>
     getServedUrl(identityPath: string): Promise<string>
     sourceMaps?: 'external' | 'inline'
   },
@@ -77,6 +83,12 @@ async function rewriteDependencies(
   resolvedStyle: ResolvedStyle,
   options: {
     getServedUrl(identityPath: string): Promise<string>
+    getServedFileUrl?(
+      identityPath: string,
+      options: {
+        transform: readonly string[] | null
+      },
+    ): Promise<string>
   },
 ): Promise<{ code: string; sourceMap: string | null }> {
   if (resolvedStyle.dependencies.length === 0) {
@@ -92,7 +104,14 @@ async function rewriteDependencies(
     let replacement =
       dependency.kind === 'external'
         ? dependency.replacement
-        : `${await options.getServedUrl(dependency.depPath)}${dependency.suffix}`
+        : dependency.kind === 'style'
+          ? `${await options.getServedUrl(dependency.depPath)}${dependency.suffix}`
+          : appendUrlSuffix(
+              await getServedFileUrl(options, resolvedStyle.identityPath, dependency.depPath, {
+                transform: dependency.requestTransform,
+              }),
+              dependency.suffix,
+            )
     let start = resolvedStyle.rawCode.indexOf(dependency.placeholder)
     if (start < 0) {
       throw createAssetServerCompilationError(
@@ -117,6 +136,61 @@ async function rewriteDependencies(
   }
 }
 
+function appendUrlSuffix(url: string, suffix: string): string {
+  if (!suffix.startsWith('?') || !url.includes('?')) {
+    return `${url}${suffix}`
+  }
+
+  return `${url}&${suffix.slice(1)}`
+}
+
+async function getServedFileUrl(
+  options: {
+    getServedFileUrl?(
+      identityPath: string,
+      options: {
+        transform: readonly string[] | null
+      },
+    ): Promise<string>
+    getServedUrl(identityPath: string): Promise<string>
+  },
+  importerPath: string,
+  identityPath: string,
+  request: {
+    transform: readonly string[] | null
+  },
+): Promise<string> {
+  if (!options.getServedFileUrl) {
+    throw createAssetServerCompilationError(`Missing file URL resolver for ${identityPath}.`, {
+      code: 'EMIT_FAILED',
+    })
+  }
+
+  try {
+    return await options.getServedFileUrl(identityPath, request)
+  } catch (error) {
+    if (
+      request.transform !== null &&
+      isAssetServerCompilationError(error) &&
+      error.code === 'FILE_TRANSFORM_QUERY_INVALID'
+    ) {
+      console.warn(
+        `Invalid file transform request "${request.transform.join(',')}" in CSS asset ${importerPath} for ${identityPath}: ${error.message}`,
+      )
+      let href = await options.getServedFileUrl(identityPath, { transform: null })
+      let searchParams = new URLSearchParams()
+      for (let transform of request.transform) {
+        searchParams.append('transform', transform)
+      }
+
+      let search = searchParams.toString()
+      return search.length > 0 ? `${href}?${search}` : href
+    }
+
+    throw error
+  }
+}
+
 async function createEmittedAsset(content: string): Promise<EmittedAsset> {
   return {
     content,