我使用lit组件和vite +类型记录模板。现在我正在尝试创建我自己的代码块web组件。为了突出语法,我想要使用,所以我去了他们的页面,选择了我最喜欢的语言,下载了css和js文件,并尝试将它们添加到我的went组件中。
我只是把css文件复制到一个css``中,它应该工作得很好。但是我不知道如何添加js文件。
下面是我在使用.js文件时所做的工作:
在"allowJs": true中设置tsconfig.json。
import * as prism from '../prism.js'; in myFile.ts,在那里我有我的组件。
但是,
我正在使用第三方库,这显然迫使我在我的chord-diagram.component.css中放入一些css。所以基本上我有我的组件:
import {Component, Input, OnInit} from '@angular/core';
const Circle = require('chord'); //third party lib
const Model = require('model'); //third party lib
@Component({
selector: 'chord-diagram'
我正在使用棱镜来展示我的文档。所以我在这里展示了一些漂亮的代码。安装prism有两种方式:手动安装或使用节点安装。我使用node安装它。但是要使用它的插件,没有文档可以解释:唯一可用的例子是:
var code = "var data = 1;";
var html = Prism.highlight(code, Prism.languages.javascript);
然后显示html..。在我的例子中,我想使用行号。怎么做?
我只是试图在我的应用程序中使用这个包( vuejs 3 ),但是我总是收到前面提到的错误。
TS7016: Could not find a declaration file for module 'prismjs/components/prism-core'. 'C:/Sibeesh/GitHub/vue-resume/node_modules/prismjs/components/prism-core.js' implicitly has an 'any' type.
Try `npm i --save-dev @types/prismj
我有一些HTML,但由于某种原因,它显示为纯文本,并且不能呈现。
它看起来是这样的:
其HTML如下所示:
<div>
<mat-card>
<button mat-raised-button>Copy Code to Clipboard</button>
<mat-card-title>Card with title and footer</mat-card-title>
<mat-card-subtitle>Subtitle</mat-card-subtitle&
我正在运行以下命令:
ng build --prod --aot --base-href ./
和接收;
ERROR in Module build failed (from ./node_modules/sass-loader/lib/loader.js):
$clr-popover-box-shadow-color: rgba(clr-getColor(dark), 0.25);
^
Argument `$color` of `rgba($color, $alpha)` must be a color
i
运行以下命令:
ng build --prod --base-href ./
我得到了:
ERROR in : 'clr-icon' is not a known element:
1. If 'clr-icon' is an Angular component, then verify that it is part of this module.
2. If 'clr-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule
我真的很努力地为我的个人网站添加语法突出显示,我在那里参考我所学到的概念。
起初,为了记录我的笔记,我使用了Markdown,因为这很容易记笔记。但随着我的探索越来越多,我发现我想要的东西比Markdown所能做的要多得多,并意识到我想做我的网站。
基本上,我使用pandoc将我非常大的.md文件转换成.html,我想我或多或少被弄得一团糟。当然没有CSS,有一段时间我真的环顾四周,想弄清楚如何让html看起来很棒。我想我应该从语法突出显示我的代码片段开始,这些代码片段被转换为类似于:
<p>Hello World in C</p>
<pre><cod