editorjs html

Editorjs-html

Un utilitaire pour analyser les éditeurs de données de nettoyage à HTML.

• Utilisez-le avec JavaScript / TypeScript simple, React, Angular, Vue ou tout moteur / cadre de modèles de votre choix.
• Rapide, efficace et léger.
• Entièrement personnalisable au cœur.
• Prend en charge les blocs de base des éditeurs qui sont également personnalisables.
• Prolonger pour analyser vos propres blocs.

Qu'est-ce que «nouveau dans V4?

• Réécriture complète, les dernières dépendances avec un minimum de modifications d'API.
• Les fonctions parseStrict() et validate() redondantes sont supprimées.
• Le mode strict est configurable via des options.
• Erreurs de console Si l'analyseur fonctionne pour le bloc n'est pas avaiable. Le mode strict jette des erreurs.
• Le code est plus lisible, modulaire. Cela faciliterait la contribution et le suivi des changements.
• Les définitions de type sont directement récupérées à partir de l'éditor.js, donc le développement devient plus facile.
• Test unitaire avec la plaisanterie.

Installation

Hôte auto, versions précompilées.

• Browser - get /.build/edjshtml.browser.js

• Nodejs - get /.build/edjshtml.node.js

• Pour le navigateur et le nœud - get /.build/edjshtml.js

NPM

npm install editorjs-html

Monnaie

• https://cdn.jsdelivr.net/npm/[email protected]/.build/edjshtml.js
• (Builder Build unique

Usage

Navigateur

  const edjsParser = edjsHTML ( ) ;
  let html = edjsParser . parse ( editorjs_clean_data ) ;
  console . log ( html ) ;

Nodejs

  const edjsHTML = require ( "editorjs-html" ) ;
  const edjsParser = edjsHTML ( ) ;
  const html = edjsParser . parse ( editorjs_clean_data ) ;

  console . log ( html ) ; 

Mises à jour

Voir les versions

Docs

Types de blocs pris en charge

• En-tête (H1-H6)
• Listes (commandées et non ordonnées)
• Listes imbriquées
• Image
• Délimiteur
• Paragraphe
• Citation
• Code
• Encombrer

Analyser l'objet de données entièrement éditeurjs

  const edjsParser = edjsHTML ( ) ;
  const HTML = edjsParser . parse ( editorjs_data ) ;
  // returns array of html strings per block
  console . log ( HTML ) ; 

Parse EditorJs Data Object (Mode strict) analyse entièrement

  const edjsParser = edjsHTML ( ) ;
  const HTML = edjsParser . parse ( editorjs_data ) ;
  // returns an error
  if ( HTML instanceof Error ) throw HTML ;

  // in case of success, returns an array of strings
  console . log ( HTML ) ; 

Pandifier un bloc de données propre unique

  const edjsParser = edjsHTML ( ) ;
  const blockHTML = edjsParser . parseBlock ( editorjs_data_block ) ;
  // returns string of html for this block
  console . log ( blockHTML ) ; 

Mode strict

  const edjsParser = edjsHTML ( { } , { strict : true } ) ;
  // returns the list of missing parser functions
  const blockHTML = edjsParser . parse ( editorjs_data ) ;
  console . log ( blockHTML ) ;

Étendre pour les blocs personnalisés

editorjs-html prend en charge les fonctions d'analyse d'extension et de remplacement pour les blocs.

  // Example Custom or Unrecognised Block
  {
    type : "custom" ,
    data : {
      text : "Hello World"
    }
 } 

  // Parse this block in editorjs-html
  function customParser ( block ) {
    return `<custom-tag> ${ block . data . text } </custom-tag>` ;
  }

  const plugins = {
    // The keyname must match with the type of block you want to parse with this funcion
    custom : customParser
    // ... add more or overwrite
  }

  const edjsParser =  edjsHTML ( plugins ) ; 

Contribution

Veuillez ajouter un problème ou ouvrir un RP pour tout bogue, examen ou suggestion.

Nouvelles fonctions d'analyseur

1. Pour des fonctions d'analyseurs supplémentaires, veuillez les ajouter aux parsers/block-name . Vérifiez les fonctions existantes pour les suggestions.
2. Tester tout fonctionne bien, avec pnpm test && pnpm build .
3. Ouvrez un PR, pour examen.
4. Ajoutez des tests dans le répertoire tests . Assurez-vous que vos tests passent avec une couverture appropriée.

Suggestions et recommandations

J'aimerais avoir vos commentaires et toutes les suggestions. Vous pouvez également me le faire savoir si vous avez besoin de support pour d'autres blocs EditorJS.

Soutien

Si vous trouvez cela utile, pensez à donner à ce référentiel une étoile. Vous pouvez également m'acheter un café ici

Licence

Licence publique du MIT

Auteur

@pavittarx