-
-
Save drcmda/974f84240a329fa8a9ce04bbdaffc04d to your computer and use it in GitHub Desktop.
// Only export the things that are actually needed, cut out everything else | |
export { WebGLRenderer } from 'three/src/renderers/WebGLRenderer.js' | |
export { ShaderLib } from 'three/src/renderers/shaders/ShaderLib.js' | |
export { UniformsLib } from 'three/src/renderers/shaders/UniformsLib.js' | |
export { UniformsUtils } from 'three/src/renderers/shaders/UniformsUtils.js' | |
export { ShaderChunk } from 'three/src/renderers/shaders/ShaderChunk.js' | |
export { Scene } from 'three/src/scenes/Scene.js' | |
export { Mesh } from 'three/src/objects/Mesh.js' | |
export { LineSegments } from 'three/src/objects/LineSegments.js' | |
export { Line } from 'three/src/objects/Line.js' | |
export { CubeTexture } from 'three/src/textures/CubeTexture.js' | |
export { CanvasTexture } from 'three/src/textures/CanvasTexture.js' | |
export { Group } from 'three/src/objects/Group.js' | |
export { SphereGeometry, SphereBufferGeometry } from 'three/src/geometries/SphereGeometry.js' | |
export { PlaneGeometry, PlaneBufferGeometry } from 'three/src/geometries/PlaneGeometry.js' | |
export { BoxGeometry, BoxBufferGeometry } from 'three/src/geometries/BoxGeometry.js' | |
export { ConeGeometry, ConeBufferGeometry } from 'three/src/geometries/ConeGeometry.js' | |
export { CylinderGeometry, CylinderBufferGeometry } from 'three/src/geometries/CylinderGeometry.js' | |
export { CircleGeometry, CircleBufferGeometry } from 'three/src/geometries/CircleGeometry.js' | |
export { RingGeometry, RingBufferGeometry } from 'three/src/geometries/RingGeometry.js' | |
export { EdgesGeometry } from 'three/src/geometries/EdgesGeometry.js' | |
export { Material } from 'three/src/materials/Material.js' | |
export { MeshPhongMaterial } from 'three/src/materials/MeshPhongMaterial.js' | |
export { MeshPhysicalMaterial } from 'three/src/materials/MeshPhysicalMaterial.js' | |
export { MeshBasicMaterial } from 'three/src/materials/MeshBasicMaterial.js' | |
export { LineDashedMaterial } from 'three/src/materials/LineDashedMaterial.js' | |
export { SpriteMaterial } from 'three/src/materials/SpriteMaterial.js' | |
export { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial.js' | |
export { TextureLoader } from 'three/src/loaders/TextureLoader.js' | |
export { Texture } from 'three/src/textures/Texture.js' | |
export { Sprite } from 'three/src/objects/Sprite.js' | |
export { SpotLightShadow } from 'three/src/lights/SpotLightShadow.js' | |
export { SpotLight } from 'three/src/lights/SpotLight.js' | |
export { SpotLightHelper } from 'three/src/helpers/SpotLightHelper.js' | |
export { CameraHelper } from 'three/src/helpers/CameraHelper.js' | |
export { PointLight } from 'three/src/lights/PointLight.js' | |
export { DirectionalLight } from 'three/src/lights/DirectionalLight.js' | |
export { AmbientLight } from 'three/src/lights/AmbientLight.js' | |
export { LightShadow } from 'three/src/lights/LightShadow.js' | |
export { PerspectiveCamera } from 'three/src/cameras/PerspectiveCamera.js' | |
export { OrthographicCamera } from 'three/src/cameras/OrthographicCamera.js' | |
export { BufferGeometry } from 'three/src/core/BufferGeometry.js' | |
export { Geometry } from 'three/src/core/Geometry.js' | |
export * from 'three/src/core/BufferAttribute.js' | |
export { Face3 } from 'three/src/core/Face3.js' | |
export { Object3D } from 'three/src/core/Object3D.js' | |
export { Raycaster } from 'three/src/core/Raycaster.js' | |
export { Triangle } from 'three/src/math/Triangle.js' | |
export { _Math as Math } from 'three/src/math/Math.js' | |
export { Spherical } from 'three/src/math/Spherical.js' | |
export { Cylindrical } from 'three/src/math/Cylindrical.js' | |
export { Plane } from 'three/src/math/Plane.js' | |
export { Frustum } from 'three/src/math/Frustum.js' | |
export { Sphere } from 'three/src/math/Sphere.js' | |
export { Ray } from 'three/src/math/Ray.js' | |
export { Matrix4 } from 'three/src/math/Matrix4.js' | |
export { Matrix3 } from 'three/src/math/Matrix3.js' | |
export { Box3 } from 'three/src/math/Box3.js' | |
export { Box2 } from 'three/src/math/Box2.js' | |
export { Line3 } from 'three/src/math/Line3.js' | |
export { Euler } from 'three/src/math/Euler.js' | |
export { Vector4 } from 'three/src/math/Vector4.js' | |
export { Vector3 } from 'three/src/math/Vector3.js' | |
export { Vector2 } from 'three/src/math/Vector2.js' | |
export { Quaternion } from 'three/src/math/Quaternion.js' | |
export { Color } from 'three/src/math/Color.js' | |
export { GridHelper } from 'three/src/helpers/GridHelper.js' | |
export { AxesHelper } from 'three/src/helpers/AxesHelper.js' | |
export * from 'three/src/constants.js' | |
export { InstancedBufferGeometry } from 'three/src/core/InstancedBufferGeometry.js' | |
export { InstancedInterleavedBuffer } from 'three/src/core/InstancedInterleavedBuffer.js' | |
export { InterleavedBufferAttribute } from 'three/src/core/InterleavedBufferAttribute.js' | |
export { ShaderMaterial } from 'three/src/materials/ShaderMaterial.js' | |
export { WireframeGeometry } from 'three/src/geometries/WireframeGeometry.js' |
module.exports = { | |
resolve: { | |
alias: { | |
// Forward all three imports to our exports file | |
three$: path.resolve('./build/three-exports.js'), | |
}, | |
}, | |
} |
Ah, three uses a custom rollup config to import .glsl files:
file-loader won't work out of the box here
Given the complex nature of the above file, like replacing constants, I don't think this three-exports.js pattern is a viable tradeoff if you need shader information in your r3f app
no, i think that's all done. the shaders are all ready to be imported as they are in plaintext via raw-loader. just link raw-loader to the glsl extension and it will work.
@AndrewRayCode I know it's old but here is how I did it in Next.js:
config.module.rules.push({
// shader import support
test: /\.glsl$/,
use: ['webpack-glsl-loader'],
})
should be the same in other webpack apps
I think directly doing import { WebGLRenderer, Scene, PerspectiveCamera, DirectionalLight, SphereGeometry, TextureLoader, MeshPhongMaterial, Mesh, Vector3 } from 'three';
have the same effect as keeping a separate export file ?
In next-js we need to change
jsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"three$": ["three-exports"],
}
}
}
Is the syntax right
I'm using NextJS, How can I use the export file with NextJS 13? It's not working neither with the webpack config file nor with the nextjs config file.
i tried to cut it down but it's pulled in before by something else, so to no avail. same with shaderutils which contain unnecessary things like earcut etc. it can be done with some more aggressive aliasing i guess