@remix-run/assets 0.3.0 → 0.4.0

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

@@ -66,6 +66,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 +118,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 +145,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 +262,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 +557,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 +580,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))

package/src/lib/scripts/resolve.ts

@@ -105,7 +105,7 @@ export async function resolveModule(
       transformed.unresolvedImports.length > 0
         ? await batchResolveSpecifiers(
             getUniqueSpecifiers(transformed.unresolvedImports),
-            transformed.resolvedPath,
+            transformed.identityPath,
             args.resolverFactory,
           )
         : new Map<string, ResolvedSpec>()
@@ -196,8 +196,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 +237,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 +271,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('../')
 }

package/src/lib/scripts/transform.ts

@@ -261,7 +261,7 @@ 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))
           .map((unresolved) => unresolved.specifier),

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,