refactor: code

package.json

@@ -47,6 +47,7 @@
     "cssesc": "^3.0.0",
     "icss-utils": "^4.1.1",
     "loader-utils": "^1.2.3",
+    "lodash.sortby": "^4.7.0",
     "normalize-path": "^3.0.0",
     "postcss": "^7.0.32",
     "postcss-modules-extract-imports": "^2.0.0",

src/index.js

@@ -7,6 +7,7 @@ import postcss from 'postcss';
 import postcssPkg from 'postcss/package.json';
 import validateOptions from 'schema-utils';
 import { satisfies } from 'semver';
+import sortBy from 'lodash.sortby';
 
 import CssSyntaxError from './CssSyntaxError';
 import Warning from './Warning';
@@ -21,7 +22,6 @@ import {
   getModulesPlugins,
   normalizeSourceMap,
   shouldUseModulesPlugins,
-  sortByName,
 } from './utils';
 
 export default function loader(content, map, meta) {
@@ -137,16 +137,18 @@ export default function loader(content, map, meta) {
         }
       }
 
-      imports.sort((a, b) => a.index - b.index);
       apiImports.sort((a, b) => a.index - b.index);
 
-      const sortedImports = sortByName(imports, [
-        'CSS_LOADER_ICSS_IMPORT',
-        'CSS_LOADER_AT_RULE_IMPORT',
-        'CSS_LOADER_GET_URL_IMPORT',
-        'CSS_LOADER_URL_IMPORT',
-        'CSS_LOADER_URL_REPLACEMENT',
-      ]);
+      /*
+       *   Order
+       *   CSS_LOADER_ICSS_IMPORT: [],
+       *   CSS_LOADER_AT_RULE_IMPORT: [],
+       *   CSS_LOADER_GET_URL_IMPORT: [],
+       *   CSS_LOADER_URL_IMPORT: [],
+       *   CSS_LOADER_URL_REPLACEMENT: [],
+       * */
+
+      const sortedImports = sortBy(imports, ['order', 'index']);
 
       const { localsConvention } = options;
       const esModule =

src/plugins/postcss-icss-parser.js

@@ -42,6 +42,8 @@ export default postcss.plugin(
         {
           type: 'import',
           value: {
+            // 'CSS_LOADER_ICSS_IMPORT'
+            order: 0,
             importName,
             url: options.urlHandler ? options.urlHandler(url) : url,
           },

src/plugins/postcss-import-parser.js

@@ -125,8 +125,7 @@ export default postcss.plugin(pluginName, (options) => (css, result) => {
 
               try {
                 resolvedUrl = await resolveRequests(resolver, context, [
-                  normalizedUrl,
-                  url,
+                  ...new Set([normalizedUrl, url]),
                 ]);
               } catch (error) {
                 throw error;
@@ -135,6 +134,8 @@ export default postcss.plugin(pluginName, (options) => (css, result) => {
               result.messages.push({
                 type: 'import',
                 value: {
+                  // 'CSS_LOADER_AT_RULE_IMPORT'
+                  order: 1,
                   importName,
                   url: options.urlHandler
                     ? options.urlHandler(resolvedUrl)

src/plugins/postcss-url-parser.js

@@ -114,6 +114,8 @@ export default postcss.plugin(pluginName, (options) => (css, result) => {
             pluginName,
             type: 'import',
             value: {
+              // 'CSS_LOADER_GET_URL_IMPORT'
+              order: 2,
               importName: '___CSS_LOADER_GET_URL_IMPORT___',
               url: options.urlHandler
                 ? options.urlHandler(urlToHelper)
@@ -129,6 +131,8 @@ export default postcss.plugin(pluginName, (options) => (css, result) => {
           pluginName,
           type: 'import',
           value: {
+            // 'CSS_LOADER_URL_IMPORT'
+            order: 3,
             importName,
             url: options.urlHandler
               ? options.urlHandler(normalizedUrl)
@@ -148,7 +152,15 @@ export default postcss.plugin(pluginName, (options) => (css, result) => {
         result.messages.push({
           pluginName,
           type: 'url-replacement',
-          value: { replacementName, importName, hash, needQuotes, index },
+          value: {
+            // 'CSS_LOADER_URL_REPLACEMENT'
+            order: 4,
+            replacementName,
+            importName,
+            hash,
+            needQuotes,
+            index,
+          },
         });
       }
 

src/utils.js

@@ -450,16 +450,6 @@ async function resolveRequests(resolve, context, possibleRequests) {
     });
 }
 
-function sortByName(array, orderNames) {
-  const result = [];
-
-  for (const name of orderNames) {
-    result.push(...array.filter((i) => i.importName.includes(name)));
-  }
-
-  return result;
-}
-
 /*
  * May be url is server-relative url, but not //example.com
  * */
@@ -490,6 +480,5 @@ export {
   getExportCode,
   shouldUseModulesPlugins,
   resolveRequests,
-  sortByName,
   isUrlRequestable,
 };