Bien, digamos que tengo una imagen llamada test#1234.png, mientras trato de importarla como:
background: url('./assets/test#1234.png')
obtendría este error:
Módulo no encontrado: Error: No se puede resolver './assets/test'
Por lo tanto, ni siquiera leería el nombre completo en el error, intenté escapar del hashtag como test/#1234 y también codificarlo en porcentaje como test%231234 pero aún así no tuve suerte, alguien tuvo una idea de qué podría arreglar esto. ¿problema?
NOTA: cualquier otro nombre de archivo que no contenga un hashtag funciona.
No parece que este error se origine con SASS. Ejecutar la herramienta de línea de comandos sass para compilar un solo archivo SCSS con un hashtag funcionará bien. En general, SASS no verifica el sistema de archivos para intentar resolver las rutas, solo procesa la sintaxis. El error "módulo no encontrado" está siendo activado por su proceso de compilación, probablemente React.
El hashtag es un carácter reservado para URI (que denota el fragmento).
Según RFC 3986 sección 2.2 , los caracteres reservados son:
reserved = gen-delims / sub-delims gen-delims = ":" / "/" / "?" / "#" / "[" / "]" / "@" sub-delims = "!" / "$" / "&" / "'" / "(" / ")" / "*" / "+" / "," / ";" / "="
Y, lo más importante:
Si los datos de un componente de URI entran en conflicto con el propósito de un carácter reservado como delimitador, los datos en conflicto deben codificarse en porcentaje antes de que se forme el URI.
La codificación porcentual del hastag sale a %23 , por lo que en lugar de
background: url('./assets/test#1234.png')
Usted estaría buscando para apuntar:
background: url('./assets/test%231234.png')