
pixi.js 7 已移除 `shader` 类的构造函数调用方式,`pixi.shader.from()` 现为静态工厂方法,需直接调用而非 `new pixi.shader.from(...)`,否则会抛出 `typeerror`。
在 PIXI.js v7 中,PIXI.Shader 不再是一个可被 new 实例化的类,而是完全重构为一个纯静态工具类。这意味着 PIXI.Shader.from() 不再是构造函数,而是一个返回已配置 Shader 实例的工厂方法。这是 v7 为统一 API 设计、提升类型安全与运行时性能所做的一项重要变更(类似 PIXI.Texture.from()、PIXI.Graphics.from() 等模式)。
✅ 正确写法(v7+)
// ✅ 正确:直接调用静态方法,不使用 new const material = PIXI.Shader.from(null, shaderCode, uniforms);
❌ 错误写法(v6 及之前兼容,v7 报错)
// ❌ 错误:v7 中 PIXI.Shader 无构造函数,new 会触发 TypeError const material = new PIXI.Shader.from(null, shaderCode, uniforms); // Uncaught TypeError: PIXI.Shader.from is not a constructor
? 为什么文档看似“没变”? 官方文档中 Shader.from() 的签名未调整措辞(如未明确标注 “static factory method”),但其底层实现已彻底去除了类实例化逻辑。API 参考页仍保留该方法,但语义已从“构造器”转变为“创建器”。
其他注意事项
- GLSL 版本适配:v7 默认使用 WebGL2,着色器代码需声明 #version 300 es(若使用 fragment shader),并改用 in/out 替代 attribute/varying,主函数签名改为 void main() → out vec4 fragColor。
- Uniform 类型校验更严格:确保 uniforms 对象中的值类型与 GLSL 声明一致(例如 res: [w, h] 应为 Float32Array 或普通数组,但推荐显式 new Float32Array([w, h]))。
- 纹理绑定顺序:v7 中 Shader.from() 会自动处理纹理单元分配,但需确保传入的 texture 和 normal 均已完成加载(建议用 await PIXI.Texture.from(url) 或监听 loaded 事件)。
完整修复示例(片段节选)
// ✅ v7 兼容写法
const material = PIXI.Shader.from(
null, // vertex shader (null → 使用默认)
shaderCode,
{
tex: texture,
norm: normal,
res: new Float32Array([window.innerWidth, window.innerHeight]),
light: new Float32Array([0, 0, 0.3, 1.0])
}
);
const mesh = new PIXI.Mesh(geometry, material);
app.stage.addChild(mesh);? 总结:升级到 PIXI.js v7 后,请全局搜索项目中所有 new PIXI.Shader.from(...) 并删除 new 关键字;同时建议检查着色器语法与资源加载流程,以充分发挥 v7 的性能与类型优势。
动态WEB网站中的PHP和MySQL详细反映实际程序的需求,仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法,让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能,对常用的、强大的包









