随笔分类 -  astro

ag-grid在qwik astro中的显示
摘要：1. 创建工程 pnpm create @qwik.dev/astro@latest 2. 删除biome.json 3. 升级biome到最新版 4. 生成biome.json biome init 5. 修改biome.json 添加： "overrides": [ { "includes": 阅读全文
posted @ 2026-04-01 23:45 卓能文 阅读(5) 评论(0) 推荐(0)
用biome对astro、svelte、vue格式化时配置修改
摘要：在biome.json中添加： "overrides": [ { "includes": ["**/*.svelte", "**/*.astro", "**/*.vue"], "linter": { "rules": { "style": { "useConst": "off", "useImpor 阅读全文
posted @ 2026-04-01 10:26 卓能文 阅读(4) 评论(0) 推荐(0)
Astro编译速度优化
摘要：Astro 的编译/构建速度受多种因素影响（项目规模、依赖、配置、硬件等），下面我会从配置优化、依赖管理、构建策略、开发环境四个维度，给出可直接落地的加速方案，每个方案都包含具体操作和原理说明。 一、核心配置优化（立竿见影） 1. 启用 Astro 内置的缓存和优化 Astro 自带缓存机制，但默认 阅读全文
posted @ 2026-03-22 12:05 卓能文 阅读(12) 评论(0) 推荐(0)
astro react ace markdown editor and previewer
摘要：src/components/AceMarkdown.tsx: import { useRef, useEffect, useState } from "react"; import { $paper, type Paper } from "../store/paper"; import ace f 阅读全文
posted @ 2024-08-27 07:09 卓能文 阅读(60) 评论(0) 推荐(0)
astro react component prop type
摘要：src/components/Counter.tsx: import { useState } from "react"; interface CounterProps { count: number; } export const Counter = ({ count }: CounterProp 阅读全文
posted @ 2024-08-26 17:24 卓能文 阅读(35) 评论(0) 推荐(0)
lit ace markdown编辑器
摘要：src/components/ace-markdown.ts: import { LitElement, css, html } from "lit"; import { customElement, property, query } from "lit/decorators.js"; // im 阅读全文
posted @ 2024-08-20 10:53 卓能文 阅读(46) 评论(0) 推荐(0)
astro中浏览器端使用lit编写的components
摘要：在vite + lit中调试好的代码my.counter.ts: import { LitElement, css, html } from "lit"; import { customElement, property } from "lit/decorators.js"; import { st 阅读全文
posted @ 2024-08-20 07:40 卓能文 阅读(63) 评论(0) 推荐(0)
astro中创建web components
摘要：MyCounter.astro: <script> const template = ` <style> * { font-size: 200%; } span { width: 4rem; display: inline-block; text-align: center; } button { 阅读全文
posted @ 2024-08-07 22:13 卓能文 阅读(36) 评论(0) 推荐(0)
astro中创建components
摘要：先创建AstroHeart.astro: <astro-heart> <button aria-label="Heart">💜</button> × <span>0</span> </astro-heart> <script> // Define the behaviour for our new 阅读全文
posted @ 2024-08-07 20:33 卓能文 阅读(48) 评论(0) 推荐(0)
astro中使用第三方控件问题
摘要：import Editor from "@monaco-editor/react"; import { useState } from "react"; import Markdown from "react-markdown"; import rehypeHighlight from "rehyp 阅读全文
posted @ 2024-08-06 16:03 卓能文 阅读(68) 评论(0) 推荐(0)
astro cherry-markdown 示例
摘要：cherry-markdown是一个TS编写的markdown编辑器。 import "cherry-markdown/dist/cherry-markdown.css"; <cherry-mark> <textarea></textarea> </cherry-mark> <script> imp 阅读全文
posted @ 2024-08-04 18:36 卓能文 阅读(169) 评论(0) 推荐(0)