在项目中加载markdown用npm包（angular 11.0.0以上版本）踩坑记

 

 

前言：目前大部分的博客都是将markdown包文件下载下来，解压到assets目录，然后加载引用assets目录下的资源包

一、生成angular项目

ng new markdownDemo //项目生成
npm i editor.md  //安装markdown资源包
npm i jquery

二、在angular.json中配置加载资源

"styles": [
   "src/styles.css",
   "node_modules/editor.md/css/editormd.css"
],
"scripts": ["node_modules/jquery/dist/jquery.min.js",
            "node_modules/editor.md/editormd.js"]

踩坑点1：jquery得放在editormd.js前面

三、html中初始化加载markdown

<div style="height: 500px;">
  markdown
  <div id="container">
    <textarea id="markdown" style="display: none;"></textarea>
  </div>
</div>

// ts中
import { Component, OnInit, AfterViewInit } from '@angular/core';
declare const editormd: any;