更新CSS后自定义NPM模块gatsby-ui-components无法导入问题

问题原因及解决步骤 #

当前报错是Node解析器无法在安装的gatsby-ui-components模块中找到符合入口配置的文件，可按以下顺序排查：

• 检查模块的入口配置与构建流程是否匹配
  你模块的package.json中main字段配置为index.js，但你的构建脚本会将所有编译产物输出到dist目录，同时会把package.json复制到dist目录内。如果发布模块时你直接发布了项目根目录，而非dist目录，那么安装后的模块根目录下不存在index.js文件，自然无法解析。
  两种修复方案二选一：
  1. 保持现有发布逻辑，每次构建完成后进入dist目录执行发布操作
  2. 修改项目根目录package.json的main字段为dist/index.js，直接发布项目根目录即可
• 确认本地调试的构建操作正常执行
  如果你使用npm link/yarn link做本地开发调试，修改CSS后必须重新执行npm run build，才能将最新代码编译到dist目录，否则关联到项目中的模块没有最新的入口文件，也会触发该报错。
• 确认项目依赖安装正常
  删掉项目下的node_modules文件夹和package-lock.json/yarn.lock文件，重新执行安装命令，安装完成后检查node_modules/gatsby-ui-components目录下是否存在main字段指向的index.js文件，确认文件存在即可解决问题。

额外提示：你当前导出和导入的组件名ReponsiveLogoNavBar存在拼写错误，正确拼写应该是ResponsiveLogoNavBar（少了字母s），后续可以统一修正避免其他问题。

内容的提问来源于stack exchange，提问作者Kyle Calica-St