Update logic to rearrange based on peer deps

src/getComponents.js

@@ -1,9 +1,10 @@
 import config from 'prismjs/components.js';
 
-const getPath = (type, name) =>
-    `prismjs/${config[`${type}`].meta.path.replace(/\{id\}/g, name)}`;
+const getPath = type => name =>
+    `prismjs/${config[type].meta.path.replace(/\{id\}/g, name)}`;
 
 const getRequire = (type, name) => config[type][name].require;
+const getPeers = (type, name) => config[type][name].peerDependencies;
 const getNoCSS = (type, name) => config[type][name].noCSS;
 
 const getTheme = theme => {
@@ -13,39 +14,57 @@ const getTheme = theme => {
         theme = `prism-${theme}`;
     }
 
-    return getPath('themes', theme);
+    return getPath('themes')(theme);
 };
 
-const getDependencies = (type, css) => function getDependencies(deps, require) {
-    if (!require) {
+const getDependencies = (type) => function getDependencies(deps, newDeps) {
+    if (!newDeps) {
         return deps;
     }
 
-    if (!Array.isArray(require)) {
-        require = [require];
+    if (!Array.isArray(newDeps)) {
+        newDeps = [newDeps];
     }
 
-    return require.reduce((deps, name) => {
-        deps = getDependencies(deps, getRequire(type, name));
+    deps = newDeps.reduce((deps, dep) => {
+        deps = getDependencies(deps, getRequire(type, dep));
 
-        if (deps.indexOf(getPath(type, name)) === -1) {
-            const add = [];
-
-            if (css && type === 'plugins' && !getNoCSS(type, name)) {
-                add.push(getPath(type, name) + '.css');
-            }
-
-            add.push(getPath(type, name));
-
-            deps = [...deps, ...add];
+        if (!deps.includes(dep)) {
+            deps.push(dep);
         }
 
         return deps;
     }, deps);
+
+    if (type === 'languages') {
+        deps.sort((a, b) => {
+            const aPeers = getPeers(type, a);
+            const bPeers = getPeers(type, b);
+
+            if (aPeers && aPeers.includes(b)) {
+                return 1;
+            }
+
+            if (bPeers && bPeers.includes(a)) {
+                return -1;
+            }
+            return 0;
+        });
+    }
+
+    return deps;
 };
 
 export default ({ languages = [], plugins = [], theme, css = false } = {}) => [
-    ...languages.reduce(getDependencies('languages'), []),
-    ...plugins.reduce(getDependencies('plugins', css), []),
+    ...languages.reduce(getDependencies('languages'), []).map(getPath('languages')),
+    ...plugins.reduce(getDependencies('plugins'), []).reduce((deps, dep) => {
+        const add = [getPath('plugins')(dep)];
+
+        if (css && !getNoCSS('plugins', dep)) {
+            add.unshift(getPath('plugins')(dep) + '.css');
+        }
+
+        return [...deps, ...add];
+    }, []),
     ...(css && theme ? [getTheme(theme)] : [])
 ];

test/fixtures/one-language-with-peer-dep/expected.js

@@ -0,0 +1,4 @@
+import Prism from "prismjs/components/prism-core";
+import "prismjs/components/prism-clike";
+import "prismjs/components/prism-markup";
+import "prismjs/components/prism-javascript";

test/fixtures/one-language-with-peer-dep/options.json

@@ -0,0 +1,3 @@
+{
+  "languages": ["javascript", "markup"]
+}

test/fixtures/several-languages/expected.js

@@ -1,6 +1,6 @@
 import Prism from "prismjs/components/prism-core";
 import "prismjs/components/prism-clike";
-import "prismjs/components/prism-javascript";
 import "prismjs/components/prism-markup";
+import "prismjs/components/prism-javascript";
 import "prismjs/components/prism-jsx";
 import "prismjs/components/prism-reason";