🧊🧊🧊 icegl-three-vue-tres 🧊🧊🧊

🎉🎉🎊 三维可视化项目快速实现的开源框架 🎊🎉🎉

GitHub最后提交

## 🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊🧊

如果对您有帮助，您可以点击右上角的 "Star⭐" 进行收藏，您的star就是我开发的动力，感谢！

点击下方 👇🏻 跳转到B站上关于此项目的视频说明

生态 `@ThreeJS-@Vue3.x-@TresJS`

icegl出品，永久开源且免费商用，持续更新中，请点击右上角的 start⭐ 关注

本项目融合了三大生态系统：

🎲 ThreeJS * 点击详情 ThreeJS 是基于浏览器渲染的著名JavaScript 3D库。
🍀 Vue3.x * 点击详情易学易用，性能出色，适用场景丰富的Web前端框架。
⚡ TresJS * 点击详情

使用Vue3.x组件实现声明式的ThreeJS，用于前端三维项目开发。

🏕 点击预览：🌏opensource.icegl.cn

如果访问太慢，请访问镜像站点：🌏 http://myhome.217dan.com:8899
如果有条件翻墙，也可直接访问github的镜像站:🌏 https://hawk86104.github.io

因项目经常更新编译，如发现访问错误，请清空浏览器缓存。

更多演示请进入预览页面

优势

🌈 前端的基本素养 * FesJS 点击详情集成封装项目落地的常用库：图标、多语言、API 接口调用、Vuex/Pinia、model 数据封装、页面 layout/权限 access、路由管理等。
🌠 像写 Vue3.x 一样写三维可视化项目点击详情

npm 全功能版本追溯保持 threeJS 最新版本 * TresJS 最新 Vue3.x 的语法糖写法，TS/JS 通吃，让你以最新最爽快的方式构建三维可视化项目

<template>
    <TresCanvas window-size>
        <TresPerspectiveCamera />
        <TresMesh>
            <TresTorusGeometry :args="[1, 0.5, 16, 32]" />
            <TresMeshBasicMaterial color="orange" />
        </TresMesh>
    </TresCanvas>
</template>
<script setup lang="ts">
    import { useRenderLoop, useTexture } from '@tresjs/core'
    //读取材质
    const pTexture = await useTexture(['./**.jpg', './**.png'])
    const { onLoop } = useRenderLoop()
    onLoop(({ delta }) => {
        //循环render
    })
</script>

敬请右上角一键三连: 关注 💛 点赞 ⭐ fork👣

✅ 快速开始

1、git clone 或者直接下载本项目

2、cd 到项目根目录

3、yarn	//安装依赖

4、yarn pre.dev	// 预览下的调试模式

5、yarn dev // 自己项目下的调试模式

6、yarn pre.build	//预览下的编译打包

7、yarn build	//自己项目下的编译打包

8、yarn both  //同时启动 dev 和 pre.dev 可以边调试自己的项目，边对照移植样例和插件