Exploration 0.0.6着色器探索（Aladino）
着色器实验的练手机会、React项目的上手模板、Three.js和WebGL结合的前端动效小场景，exploration-006这个项目是个挺不错的尝试平台。用create-react-app搭的底子，目录结构清晰，该有的脚本也都在，直接上手快。
项目目录里的脚本挺常见，yarn start就能跑起来，调试体验顺滑。改代码实时刷新，控制台还能报错提示，前期开发挺省心的。要打包上线的话，用yarn build就行，代码会压缩、加哈希，部署不用操太多心。
着色器逻辑是在 React 组件里包着的，样式和交互是解耦的。你要是想搞点粒子动画、材质渐变啥的，可以直接改glsl片段。不熟的朋友也别慌，跑起来之后改点参数，立马能看到效果。
建议你用VSCode配上GLSL Language Support插件，写着色器时提示全、语法高亮也舒服。另外调试时可以结合浏览器的webgl-inspector插件，看渲染状态也挺方便。
如果你是前端做得多，正好想玩点图形相关的东西，又不想从零搭 webpack 配置，那这个项目就挺适合你。顺便补几篇相关教程：
如果你要重写构建配置，可以yarn eject，但注意：这是不可逆的，别随便点。
文件大小：1.55MB
评论区