简介
在前端开发中，我们经常遇到因为大小写不敏感而导致的一些问题，如文件名大小写不一致、import 导入时错误等。neutrino-middleware-case-sensitive-paths 就是一个能够解决这些问题的 Neutrino 中间件。
neutrino-middleware-case-sensitive-paths 会在 entrée module 内部打开 Watchpack 对象并注册监听器，当有文件名大小写不一致时就废弃该文件，以避免开发人员因为这个问题浪费时间。
安装
使用 npm 或者 yarn 进行安装：
npm install --save-dev neutrino-middleware-case-sensitive-paths
或者
yarn add --dev neutrino-middleware-case-sensitive-paths
使用
在 neutrino webpack 配置文件中使用 neutrino-middleware-case-sensitive-paths 。
例如，在使用 create-react-app 创建的项目中，可以在 config/webpack.config.js 中进行配置：
-- -------------------- ---- -------
-------------- - -------- ------------ -
------ -
-- ---
------- -
-- ---
--
-------- -
-- ---
--
-------- -
-- ---
--
------------- -
-- ---
-
--
--使用 neutrino-middleware-case-sensitive-paths 后，你需要在 plugins 中引入此插件。
const middlewares = require('neutrino-middleware-case-sensitive-paths');
module.exports = function (neutrino) {
neutrino.use(middlewares);
};那么 neutrino-middleware-case-sensitive-paths 就被成功引入了。
深入了解
你可能会好奇在 neutrino-middleware-case-sensitive-paths 中是如何实现监听文件名大小写的呢？接下来我们就深入了解一下其实现方式。
Watchpack API
Watchpack 是一个负责监听文件系统变更的插件，通过注册监听器来监听文件系统下的变更并执行回调函数。Watchpack 总共有三个事件：change、modify、remove。
Change 事件是当一个新的文件被添加到 Watchpack 中时触发的事件；
modify 事件是当文件被修改时触发的事件；
remove 事件是当文件从 Watchpack 中移除时触发的事件。
Neutrino 中的 webpack 配置
neutrino-middleware-case-sensitive-paths 在 neutrino 中实现的原理主要是通过 webpack provider 的方式来提供。
webpack provider 是指在 webpack 中使用 provide 选项来提供一个公共模块，从而在不同的模块中都可以调用该模块的方法。在 neutrino 中，公共模块的提供方式就是通过工具来调用该模块的方法，就像调用实例方法一样。
总结
通过 neutrino-middleware-case-sensitive-paths 的使用教程，我们了解了其在前端开发中的应用、安装和使用等方方面面的知识点。同时，深入掌握了 neutrino-middleware-case-sensitive-paths 中 Watchpack 和 Neutrino 中的 webpack 配置的实现原理，通过本篇文章的学习，可以在实际项目中更好的使用 neutrino-middleware-case-sensitive-paths 这个 npm 包。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005752781e8991b448ea427