远程服务器上WordPress Gutenberg及@wordpress/create-block块无法运行求助

核心结论 #

远程服务器不需要安装Node.js或Webpack，自定义Gutenberg块只需本地打包完成后，上传编译好的静态资源与PHP注册文件即可运行。以下是针对你遇到的问题的具体排查步骤：

1. 排查Webpack外部依赖配置（针对自定义打包的块） #

报错Uncaught TypeError: external_wp_blocks_namespaceObject is undefined，本质是Webpack未正确将WordPress核心脚本标记为外部依赖，导致打包时试图将@wordpress/blocks等内置包打包进文件，而服务器上WP核心脚本未被正确关联。

检查你的Webpack配置文件中的externals字段，确保所有用到的@wordpress包都被正确声明：

externals: {
  '@wordpress/blocks': ['wp', 'blocks'],
  '@wordpress/element': ['wp', 'element'],
  '@wordpress/i18n': ['wp', 'i18n'],
  // 其他你用到的@wordpress模块同理
}

用@wordpress/create-block生成的默认配置本应包含上述设置，但如果上传时遗漏了block.json或打包后的JS文件，也会导致依赖解析失败。

2. 确认块的注册逻辑在服务器上生效 #

• 如果是主题内的块：检查主题的functions.php是否正确引入了块的注册PHP文件，且路径在服务器上是正确的（注意本地与服务器的文件路径差异）。
• 如果是插件形式的块：确保上传后在WP后台激活了该插件，未激活的插件不会加载任何块资源。

3. 检查服务器文件权限 #

静态资源（打包后的.js、.css文件）的权限设置错误会导致WP无法读取资源，引发依赖缺失：

• 将JS/CSS文件权限设置为644
• 将块所在文件夹权限设置为755

可以通过服务器的文件管理器或SSH命令修改权限：

chmod 644 path/to/block/build/index.js
chmod 755 path/to/block/build/

4. 验证WordPress核心脚本是否加载 #

部分服务器环境下，第三方插件或自定义主题可能会禁用WP核心脚本。打开后台编辑器页面的源码，搜索wp-blocks，如果找不到该脚本的加载标签，说明核心脚本被移除：

• 排查是否有性能优化插件（如WP Rocket、Autoptimize）禁用了不必要的脚本，需将wp-blocks、wp-element等核心Gutenberg脚本加入白名单。
• 检查主题的functions.php是否有wp_deregister_script或wp_dequeue_script操作移除了核心脚本，如有则删除相关代码。

5. 清除服务器缓存 #

远程服务器通常会启用多层缓存（WP插件缓存、服务器OPcache、CDN缓存），导致新上传的块资源未被加载：

• 清除WP后台的插件缓存（如W3 Total Cache、WP Rocket）
• 联系服务器提供商清除服务器端OPcache
• 如果使用CDN（如Cloudflare），手动清除CDN缓存

内容的提问来源于stack exchange，提问作者Islamus WiseFool