调用$(...).inputmask报错：not a function，RequireJS加载仍未解决

我之前也遇到过一模一样的问题，这个错误本质是inputmask插件没有成功挂载到jQuery对象上，大概率是加载顺序、模块依赖配置或者环境冲突的问题，结合你用RequireJS的情况，给你几个排查和解决的方向：

1. 先确认基础加载是否正常 #

• 打开浏览器开发者工具的「Network」标签，刷新页面后检查inputmask脚本文件的加载状态：
  • 确保文件路径正确，没有出现404错误；
  • 确认脚本的HTTP状态码是200，说明成功加载。
• 同时要确保jQuery在inputmask之前加载——毕竟inputmask是jQuery插件，必须依赖jQuery先存在才能完成挂载。

2. 修正RequireJS的依赖配置（重点） #

如果你用RequireJS管理模块，仅仅加载脚本是不够的，必须明确配置依赖关系：

• 首先在RequireJS的config中声明inputmask对jQuery的依赖：

  requirejs.config({
    paths: {
      'jquery': 'path/to/your/jquery',
      'inputmask': 'path/to/your/inputmask'
    },
    shim: {
      // 针对非AMD兼容的inputmask版本，需要手动指定依赖
      'inputmask': {
        deps: ['jquery'],
        exports: '$.fn.inputmask'
      }
    }
  });
  

• 然后在使用inputmask的业务模块中，必须将inputmask作为依赖引入，不能直接全局调用：

  define(['jquery', 'inputmask'], function($) {
    // 这里可以安全调用inputmask方法
    $('#target-input').inputmask('999-999-9999');
  });
  

  注：如果你的inputmask是AMD兼容版本（新版一般支持），可以不用shim配置，但依然要在模块中引入依赖。

3. 排查jQuery多版本冲突 #

有时候页面会意外加载多个jQuery实例，inputmask挂载到了其中一个，而你调用时用的是另一个：

• 在浏览器控制台执行console.log($.fn.inputmask)和console.log(jQuery.fn.inputmask)，看是否有返回值；
• 执行console.log($.fn.jquery)查看当前jQuery版本，确认页面中是否存在多个版本的jQuery脚本。

4. 检查直接加载方式的细节 #

如果你尝试过直接从服务器加载脚本，要注意script标签的顺序：

<!-- 正确顺序：先jQuery，再inputmask，最后业务脚本 -->
<script src="jquery.min.js"></script>
<script src="inputmask.min.js"></script>
<script src="your-business-script.js"></script>

• 避免给这些脚本加async或defer属性，除非你能确保它们的执行顺序符合依赖要求。

5. 确认版本兼容性 #

部分旧版inputmask可能和高版本jQuery（比如3.x+）不兼容，或者新版inputmask的API有变化：

• 尝试更换一个稳定版本的inputmask（比如v5.x系列），再测试是否能正常调用。

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