houdini-chrome-demo

houdini-study

Usage no npm install needed!

<script type="module">
  import houdiniChromeDemo from 'https://cdn.skypack.dev/houdini-chrome-demo';
</script>

README

Houdini 谷歌官方示例学习

使用

  • 为了达到效果，请安装最新版谷歌浏览器，并开启实验性选项

chrome://flags/

Experimental Web Platform features 设置为 Enabled

npm i -g houdini-chrome-demo

houdini-chrome-demo <dir-name>

cd <dir-name>/houdini-chrome-demo

http-server
  • 将 127.0.0.1 或本地 ip 替换为 localhost

更新

进入当前目录执行 houdini-chrome-demo -u 拉取最新代码

cd <dir-name>/houdini-chrome-demo

houdini-chrome-demo -u

说明

  • 仅供学习调试使用，目的是为了一起学习

  • 前期整理一些谷歌示例

  • 后期会慢慢创作和收集一些好的案例

目录

layout

  • masonry

paint

  • conic
  • ripple
  • slanted
  • star

properties

  • circle
  • transition

参考地址