Webpack如何配置Loader匹配驼峰命名的服务JS文件？

嘿，这问题很常见，我来给你捋清楚！

你之前的规则test: /\.service\.js$/是专门匹配以.service.js结尾的文件，比如你原来的core.service.js、second.service.js，完全没问题。但现在你把文件名改成了驼峰式的coreService.js、secondService.js，结尾是Service.js（首字母大写），原来的正则自然匹配不上啦。

你只需要把正则规则改成下面这样就行：

rules: [ 
  { 
    test: /Service\.js$/, 
    use: { loader: 'service-loader' } 
  } 
]

简单解释下：这个正则的意思是匹配以Service.js结尾的文件，正好完美对应你重命名后的两个文件。

如果之后你可能混用两种命名方式（比如既有.service.js又有Service.js），可以加个不区分大小写的标志i，这样两种格式都能匹配：

rules: [ 
  { 
    test: /service\.js$/i, 
    use: { loader: 'service-loader' } 
  } 
]

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