看起来你已经做了不少正确的配置，但还是遇到了这个报错，咱们一步步排查可能的原因：

1. 确认ngx-spinner版本的API兼容性 #

不同版本的ngx-spinner可能对show()方法的参数要求有变化：

• 如果你使用的是较新的版本，show()方法的第一个参数（spinner的唯一标识name）是必填项，不能传undefined。尝试给spinner指定一个明确的name：

  this.spinnerService.show('pacmanSpinner', {
    type: 'pacman',
    bdColor: 'rgba(255,255,255,0)',
    color: '#333333'
  })
  

  同时在组件模板中对应添加带name的spinner标签：

  <ngx-spinner name="pacmanSpinner"></ngx-spinner>
  

2. 验证CSS文件是否正确加载 #

虽然你在angular.json中配置了spinner.css，但可以做以下验证：

• 检查Chrome开发者工具的Network标签，搜索spinner.css，确认它的HTTP状态码是200（成功加载）
• 尝试换一种方式引入CSS：在src/styles.css中添加

  @import "~ngx-spinner/spinner.css";
  

  然后移除angular.json中对应的配置，避免重复引入

3. 确认动画类型名称的正确性 #

检查pacman是否是当前ngx-spinner版本支持的动画类型：

• 查看你安装的node_modules/ngx-spinner/src/animations目录下的文件，确认是否有pacman.css或对应命名的动画文件（注意大小写，比如是否是Pacman而不是pacman）

4. 清理项目缓存并重启 #

Angular的缓存可能导致资源未正确更新，执行以下步骤：

1. 停止当前的ng服务
2. 删除node_modules、package-lock.json（或yarn.lock）
3. 重新执行npm install
4. 用ng serve --open重启项目

5. 检查模板中是否存在ngx-spinner标签 #

如果你的组件模板中没有添加<ngx-spinner>标签，spinner无法渲染，也会导致配置参数不生效。确保模板中存在该标签，且name与show()方法中指定的一致。

如果以上步骤都尝试后仍然有问题，可以检查Chrome控制台是否有其他相关错误（比如CSS加载失败、组件初始化错误），这些额外的信息可能帮助定位问题。

内容的提问来源于stack exchange，提问作者Alejandro V