TunkShif 最近的时间轴更新
TunkShif's repos on GitHub
Elixir · 38 人关注
sprout_ui
Unstyled and accessible components for Phoenix Framework
HTML · 21 人关注
Anki-Azul-Template
Anki templates
Fennel · 17 人关注
nvim
Fennel powered neovim configuration.
TypeScript · 5 人关注
alpine-zag
Use Zag Component with AlpineJS.
Lua · 5 人关注
dotfiles
My Linux dotfiles for bspwm and awesomewm
Elixir · 3 人关注
dian-bot
TypeScript · 2 人关注
dian-bot-ng
2 人关注
Localization-Project
Mod Localization Project
Elixir · 2 人关注
zgsm_bot
¿zgsm?
Shell · 1 人关注
fish-functions
Collection of useful functions and aliases for fish shell.
JavaScript · 1 人关注
gatsby-theme-blog-asmar
Gatsby theme for personal blog
C · 1 人关注
RPN-Calc
Calculator program written in C base on Reverse Polish Notation
Lua · 1 人关注
yasm.nvim
Yet Another Session Manager for neovim
TypeScript · 0 人关注
abyss-watcher
Watch your Steam friends' activity, push notifications with Bot
Java · 0 人关注
Additional-Buildcraft-Objects
A new repository of ABO for myself with administrator rights....
OCaml · 0 人关注
advent-of-code
0 人关注
Anki-Android
AnkiDroid: Anki flashcards on Android. Your secret trick to achieve superhuman information retention.
TypeScript · 0 人关注
anki-estrella
Online Anki Vocabulary Card Maker
Kotlin · 0 人关注
AnkiEstrellaDroid
[WIP]
Java · 0 人关注
AppleMilkTea2_1.7.10
AppleMilkTea2 Mod for Minecraft 1.7.10
CSS · 0 人关注
Arco
A simple static site generator written in python
Java · 0 人关注
AutoCrafter2000
Continuation of the CCM project
Java · 0 人关注
Botania
A magic mod for Minecraft based on nature and plant life.
Java · 0 人关注
Brewcraft
Elixir · 0 人关注
caffe
Write Elixir-Flavored JavaScript with Caffe!
0 人关注
chatgpt-vercel
Elegant and Powerfull. Powered by OpenAI and Vercel.
Crystal · 0 人关注
crystal
The Crystal Programming Language
Java · 0 人关注
D3Commands
Some useful commands and other server admin tools.
Java · 0 人关注
D3Core
DoubleDoorDevelopment Core
HTML · 0 人关注
dictlet-api
Multi-language dictionary API service
Vue · 0 人关注
dictlet-app
Multi-language dictionary web app with minimalistic design
0 人关注
didact
A DIY guide to build your own React
0 人关注
elixir-web-push
Simple web push library for Elixir
0 人关注
elixirscript-starter-kit
"Hello World" demo for getting started with ElixirScript
Java · 0 人关注
enderutilities
Ender Utilities mod for Minecraft
0 人关注
eopl-exercise
TypeScript · 0 人关注
EPUBer
0 人关注
ExtraUtilities_Localization
Localization support for Extra Utilities
Java · 0 人关注
Fake-Ores-2
The new version of Fake Ores (without the dimension now.) http://minecraftforgefrance.fr/showthread.php?tid=406
TypeScript · 0 人关注
felter
Java · 0 人关注
FluidityFoodstuffs_1.7.10
Mod for Monecraft 1.7.10
Java · 0 人关注
ForbiddenMagic
A Minecraft mod about being dark and brooding
JavaScript · 0 人关注
gigalixir-action
A GitHub Action for deploying Phoenix applications to Gigalixir
Python · 0 人关注
ImageSearchProject
Image Search Application Project
Java · 0 人关注
InfiniteInvo
Enlarge the vanilla Minecraft inventory infintely (or until Java runs out of memory at 2.14 billion slot!)
Java · 0 人关注
IronChain2_1.7.10
IronChain2 Mod for Minecraft 1.7.10
Java · 0 人关注
JACB
Just another Crafting Bench
Java · 0 人关注
JPAddon-for-AppleMilkTea2
"Japanese" Addon for AppleMilkTea2
TypeScript · 0 人关注
leo-project
An epub reader for learning languages.
TypeScript · 0 人关注
live-element
Create custom element that works with Phoenix LiveView
Elixir · 0 人关注
live_blog_ex
LiveBlog built with *PETL* stack
0 人关注
Localization-Database
For some reasons, I have to find a place to store some files I'm working on. Here it is!
Zig · 0 人关注
lox-project
Lox language from Crafting Interpreters implemented in Kotlin and Zig
Crystal · 0 人关注
lsp.cr
Language Server Protocol Specification Implemented in Crystal
0 人关注
mason-registry
Core registry for mason.nvim.
Elixir · 0 人关注
mc-mod-manager
Minecraft Mod Manager, a CLI Tool for fetching and updating mods from CurseForge
Java · 0 人关注
Modular-Systems
The conceptual successor of Modular Furnace. Modular Systems is a mod about building multi-blocks your way. From furnaces to crafting this mod enables you to tweak performance and behavior to what you want
Java · 0 人关注
NeoTech
Tech Mod for Minecraft 1.8
0 人关注
NPP-ZenScript
Notepad ++ ZenScript Highlight
0 人关注
nvim-lspconfig
Quickstart configs for Nvim LSP
Crystal · 0 人关注
opal
Opal is a language server for Crystal programming language.
Java · 0 人关注
OpenBlocks
Random collection of blocks
0 人关注
park-ui
Beautifully designed components built on Ark UI that work for the JS and CSS frameworks of your choice.
0 人关注
phoenix
Peace of mind from prototype to production
Elixir · 0 人关注
pinegeist
AlpineJS integration for Phoenix LiveView
TypeScript · 0 人关注
pratt-parser-demo-ts
Java · 0 人关注
Progression
TypeScript · 0 人关注
proto-react
Rust · 0 人关注
rcore-study
0 人关注
rCore-Tutorial-v3
Let's write an OS which can run on RISC-V in Rust from scratch!
TypeScript · 0 人关注
rez-project
Java · 0 人关注
SextiarySector2
Minecraftに第六次産業の概念(?)を追加するMOD
Kotlin · 0 人关注
SimpleTodo
Simple Todo API written with SpringBoot
0 人关注
site
PocketBase Site
Java · 0 人关注
SolarFlux
Mod for Minecraft - Adds solar panels that produce Redstone Flux
Rust · 0 人关注
spdict
CLI tool for Span¡shD!ct
Elixir · 0 人关注
sprout_ui_docs
0 人关注
starlight
🌟 Build beautiful, accessible, high-performance documentation websites with Astro
Java · 0 人关注
symcalc
A mod that allows for the simple calculation of the instability of a Thaumcraft 4 infusion altar.
Java · 0 人关注
TechReborn
The official repo for the TechReborn Minecraft mod
0 人关注
Temp_LocalizationFile
A repository where can put some localization files that no more appropriate place for them, or the files that need to be edited frequently
Shell · 0 人关注
theme-lambda
Java · 0 人关注
ThermalFoundation
Zig · 0 人关注
tiny-hash-zig
Java · 0 人关注
Tiny-Storage
Minecraft Mod:- Adds tiny storage options to the game!
Java · 0 人关注
TinyHashMap-Lab
Java · 0 人关注
TofuFactory-MC1.7.10
豆腐Craftの工業mod連携アドオン
Java · 0 人关注
TubeTransportSystem
Tube Transport System for Minecraft
0 人关注
TunkShif
TypeScript · 0 人关注
tunkshif.one
TypeScript · 0 人关注
vanilla-presence
TypeScript · 0 人关注
vanilla-transition
Vanilla Transition enables you to easily create transitions.
Java · 0 人关注
VeganOption
A Minecraft mod that seeks to add vegan alternatives to all Minecraft mob/animal products
ReScript · 0 人关注
vite-rescript-react-tailwindcss-template
ReScript React with TailwindCSS on Vite
Shell · 0 人关注
winetricks-zh
A setup wizard for Chinese wine usrs
Java · 0 人关注
WitchingGadgets
Thaumcraft Addon for those that still crave more content
0 人关注
WorkingTime
CSS · 0 人关注
Xftm-Theme
A modern theme based on Numix
TunkShif

TunkShif

V2EX 第 466982 号会员,加入于 2020-01-28 17:36:47 +08:00
TunkShif 最近回复了
2023-10-20 22:44:40 +08:00
回复了 ChrisFreeMan 创建的主题 Node.js Web Components 2023 年 10 月份了,现在怎么样了
Web Components 实际上是 Custom Elements, Shadow DOM 和 Templates and Slots 这几个 API 组成的一套技术,这几个都是比较 low level 的 API, 实际上开发的时候还是需要使用 Lit 或者 Stencil 这样的框架,另外像 Vue, Svelte 和 SolidJS 也都可以直接将组件导出成 Custom Element 。

目前个人感觉 Shadow DOM 的坑还是挺多的,比如样式隔离的问题,外部的 CSS 无法作用于 Shadow DOM 内,要写出 Headless 的无样式组件比较困难,当前有 CSS ::part() 选择器的方案可以解决部分问题。还有 form 表单不会识别 Shadow DOM 内的 input 元素,似乎 ElementInternals 和 FormAssociated 这一 API 能解决。另外 Shadow DOM 的 SSR 方案可能也还得等到几家浏览器支持 Declarative Shadow DOM 了才能稳定。

目前我个人感觉 Web Components 适用的场景主要下面两个:
一是用来开发封装专门功能的复杂组件,可以很方便的集成到其它任何应用里使用,比如这个 Emoji Picker ( https://nolanlawson.github.io/emoji-picker-element/),还有这个 Giscus 的评论组件 ( https://github.com/giscus/giscus-component )。
另外一个就是用来实现一套完整的 Design System 的组件库,比如像 Material Design ( https://material-web.dev/),微软的 Fluent UI ( https://developer.microsoft.com/en-us/fluentui#/),不过 Fluent 2 改用 React 了。这种情况下我觉得特别适用于像 Django 或者 Ruby on Rails 这样传统的搞后端模板渲染的 Web 框架使用,替代 Bootstrap 这类的方案。
其余情况我还是建议 React, Vue 之类的吧。

另外如果感兴趣推荐参考一下 Shoelace ( https://shoelace.style/),我感觉是目前最完善的 Web Components 组件库,文档里对主题、动画、本地化定制,还有前面提到的表单的问题都有给出解决方案。
2023-09-10 17:47:20 +08:00
回复了 Thunderaxe 创建的主题 JavaScript 请教一个 ts 的问题
假定有 type A = { foo: string }, type B = { bar: string }, type C = A & B, const obj = { foo: "foo", bar: "bar" }
那么 let a: A = obj, let b: B = obj, let c: C = obj 都是成立的
即 obj 这个值的类型既可以是 A ,也可以是 B ,还可以是 C ,[TS Playground]( https://www.typescriptlang.org/play?#code/C4TwDgpgBAglC8UDeAoKUBmB7LAuKAzsAE4CWAdgOYoC+KKokUAQgsmlAEYCGx+RZKrXqNoAYTZwAZC3oBjLOSJQsnAFZtU6bHigAiHXoA0HHn31njp7gC98enjb3CUAGwjAo3fHESq1bh5c+Kx+6oGecvgSYWpAA)
因为 TypeScript 的类型系统是 [structural typing]( https://www.typescriptlang.org/play#example/structural-typing) 的,类型 type A = { foo: string } 并不是表示仅有 foo 这一个属性的对象才属于该类型,而是表示只要某对象含有 foo 这一个属性便属于该类型
所以属于类型 A 的值为含有 foo 属性的全体对象,属于类型 B 的值为含有 bar 属性的全体对象,那么属于 A 和 B 的交集类型的值则为同时含有 foo 和 bar 属性的全体对象
这个跟 TypeScript 的关系其实不大,Tailwind 的 LSP 可以支持根据正则来匹配要启用 Tailwind IntelliSense 的代码区域,详细可以参考 twin.macro 这个项目的 issue 来自己设置:
https://github.com/ben-rogerson/twin.macro/discussions/227

对于 OP 这种类似的需求,我个人的设置是像下图这样的:
https://imgur.com/5FRvbFU

在 Tailwind 的样式类的字符串前加一个 /* tw */ 的注释来标记启用 Tailwind IntelliSense ,相关的配置如下:

```json
{
"tailwindCSS.experimental.classRegex": [
"\\/\\* tw \\*\\/\\s+`([^`]*)"
]
}
```
```elixir
# 使用 comprehension
for file <- File.ls!("scripts"), String.end_with?(file, ".py") do file end |> Enum.join(",")

# 无脑用管道符
File.ls!("scripts") |> Enum.filter(&(String.ends_with?(&1, ".py"))) |> Enum.join(",")
```
关于   ·   帮助文档   ·   自助推广系统   ·   博客   ·   API   ·   FAQ   ·   Solana   ·   2198 人在线   最高记录 6679   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 20ms · UTC 15:33 · PVG 23:33 · LAX 07:33 · JFK 10:33
♥ Do have faith in what you're doing.