fix: Deprecation of loader options in webpack 5 (DEP_WEBPACK_RULE_LOADER_OPTIONS_STRING) (#47)

Author: freakzlike

index.js

@@ -79,7 +79,7 @@ module.exports = (api, options) => {
       chain.module.rule('vue')
         .use('vue-auto-import-quasar')
         .loader(path.join(__dirname, 'lib/loader.vue.auto-import-quasar.js'))
-        .options(strategy)
+        .options({ strategy })
         .before('cache-loader')
 
       chain.module.rule('js-transform-quasar-imports')

lib/loader.vue.auto-import-quasar.js

@@ -6,9 +6,9 @@ const importTransformation = getDevlandFile('quasar/dist/transforms/import-trans
 const runtimePath = require.resolve('./runtime.auto-import.js')
 
 const compRegex = {
-  '?kebab': new RegExp(autoImportData.regex.kebabComponents || autoImportData.regex.components, 'g'),
-  '?pascal': new RegExp(autoImportData.regex.pascalComponents || autoImportData.regex.components, 'g'),
-  '?combined': new RegExp(autoImportData.regex.components, 'g')
+  'kebab': new RegExp(autoImportData.regex.kebabComponents || autoImportData.regex.components, 'g'),
+  'pascal': new RegExp(autoImportData.regex.pascalComponents || autoImportData.regex.components, 'g'),
+  'combined': new RegExp(autoImportData.regex.components, 'g')
 }
 
 const dirRegex = new RegExp(autoImportData.regex.directives, 'g')
@@ -20,7 +20,10 @@ function transform (itemArray) {
 }
 
 function extract (content, ctx) {
-  let comp = content.match(compRegex[ctx.query])
+  // Use webpack v5 getOptions or fallback to ctx.query for webpack v4
+  const { strategy } = ctx.getOptions ? ctx.getOptions() : ctx.query
+
+  let comp = content.match(compRegex[strategy])
   let dir = content.match(dirRegex)
 
   if (comp === null && dir === null) {
@@ -35,11 +38,11 @@ function extract (content, ctx) {
     comp = Array.from(new Set(comp))
 
     // map comp names only if not pascal-case already
-    if (ctx.query !== '?pascal') {
+    if (strategy !== 'pascal') {
       comp = comp.map(name => autoImportData.importName[name])
     }
 
-    if (ctx.query === '?combined') {
+    if (strategy === 'combined') {
       // could have been transformed QIcon and q-icon too,
       // so avoid duplicates
       comp = Array.from(new Set(comp))