Búsqueda de sitios web

javascript - Cargar solo la biblioteca highlight.js usando TypeScript, no la predeterminada con todos los idiomas cargados

Como sugiere el documento oficial de uso de highlight.js:

¡La importación por defecto importa todos los idiomas! Por lo tanto, es probable que sea más eficiente importar solo la biblioteca y los idiomas que necesitas:

import hljs from 'highlight.js/lib/highlight';
import javascript from 'highlight.js/lib/languages/javascript';
hljs.registerLanguage('javascript', javascript);

Estoy tratando de cargar solo la biblioteca highlight.js, junto con módulos de lenguaje individuales para reducir mi huella para mi aplicación TS.

Usando el archivo de declaraciones @types/highlight.js, la única manera (que puedo encontrar) de importar highlight.js es así:

import * as hljs from 'highlight.js';

Desafortunadamente, eso carga la exportación predeterminada, que tiene todos los idiomas incluidos cargados.

Examinando el módulo highlight.js, quiero hacer algo como esto:

import * as hljs from 'highlight.js/lib/highlight.js';
import * xml from 'highlight.js/lib/languages/xml';
...
hljs.registerLanguage('xml', xml);

así que solo obtengo la biblioteca en sí, junto con el único idioma que necesito (xml).

Hasta ahora, he podido agregar estas líneas en un archivo .d.ts para que TypeScript no se queje de estas importaciones:

declare module 'highlight.js/lib/highlight';
declare module 'highlight.js/lib/language/xml';

Pero por supuesto, eso significa que pierdo mi asistencia de contenido al importar hljs. Podría duplicar el contenido de @types/highlight.js en mi propio archivo .d.ts, pero realmente me gustaría evitar eso.

¿Hay alguna manera de que pueda hacer un proxy de las declaraciones de @types/highlight.js al módulo highlight.js/lib/highlight'? O tal vez algún otro enfoque que esté pasando por alto.

Gracias de antemano.

Respuesta #1

Resolví este problema creando un archivo de Javascript que requiere solo los idiomas que necesito:

myhighlight.js

var hljs = require('../../../node_modules/highlight.js/lib/highlight');
hljs.registerLanguage('typescript', require('../../../node_modules/highlight.js/lib/languages/typescript'));
hljs.registerLanguage('json', require('../../../node_modules/highlight.js/lib/languages/json'));
module.exports = hljs;

Y al importar este archivo en mi código de Typescript:

import hljs from './myhighlight';

export class SomeClass {
  highlight(code: string) {
    return hljs.highlightAuto(code).value;
  }
}

Respuesta #2

Solo incluye los tipos agregando esta línea en la parte superior de uno de tus archivos *.d.ts (por ejemplo, global.d.ts)

/// <reference types="highlight.js/types/index.d.ts" />

Artículos relacionados