From 8a078fc5ede6d8a265f00f49219f9b2ee816524e Mon Sep 17 00:00:00 2001
From: Zhang Cheng <stephenpcg@gmail.com>
Date: Sat, 23 Nov 2019 23:30:46 +0800
Subject: [PATCH] add styleLibraryDirectory option, fixes #381

---
 README.md     | 22 ++++++++++++++++++++++
 src/Plugin.js | 14 +++++++++++++-
 src/index.js  |  6 ++++++
 3 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 0618a008..4183d532 100644
--- a/README.md
+++ b/README.md
@@ -135,6 +135,7 @@ For Example:
 - `["import", { "libraryName": "antd" }]`: import js modularly
 - `["import", { "libraryName": "antd", "style": true }]`: import js and css modularly (LESS/Sass source files)
 - `["import", { "libraryName": "antd", "style": "css" }]`: import js and css modularly (css built files)
+- `["import", { "libraryName": "element-ui", "styleLibraryDirectory": "lib/theme-chalk" }]`: import js and css modularly
 
 If option style is a `Function`, `babel-plugin-import` will auto import the file which filepath equal to the function return value. This is useful for the components library developers.
 
@@ -159,6 +160,23 @@ e.g.
 ]
 ```
 
+If `styleLibraryDirectory` is provided (default `null`), it will be used to form style file path,
+`style` will be ignored then. e.g.
+
+```javascript
+{
+  "libraryName": "element-ui",
+  "styleLibraryDirectory": "lib/theme-chalk",
+}
+
+import { Button } from 'element-ui';
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+var _button = require('element-ui/lib/button');
+require('element-ui/lib/theme-chalk/button');
+```
+
 #### customName
 
 We can use `customName` to customize import file path.
@@ -226,6 +244,10 @@ module.exports = function customName(name) {
 };
 ```
 
+#### customStyleName
+
+`customStyleName` works exactly the same as customName, except that it deals with style file path.
+
 #### transformToDefaultImport
 
 Set this option to `false` if your module does not have a `default` export.
diff --git a/src/Plugin.js b/src/Plugin.js
index bdd1190d..8de12294 100644
--- a/src/Plugin.js
+++ b/src/Plugin.js
@@ -26,6 +26,8 @@ export default class Plugin {
     libraryName,
     libraryDirectory,
     style,
+    styleLibraryDirectory,
+    customStyleName,
     camel2DashComponentName,
     camel2UnderlineComponentName,
     fileName,
@@ -43,6 +45,8 @@ export default class Plugin {
       : camel2DashComponentName;
     this.camel2UnderlineComponentName = camel2UnderlineComponentName;
     this.style = style || false;
+    this.styleLibraryDirectory = styleLibraryDirectory;
+    this.customStyleName = normalizeCustomName(customStyleName);
     this.fileName = fileName || '';
     this.customName = normalizeCustomName(customName);
     this.transformToDefaultImport = typeof transformToDefaultImport === 'undefined'
@@ -74,7 +78,15 @@ export default class Plugin {
       pluginState.selectedMethods[methodName] = this.transformToDefaultImport  // eslint-disable-line
         ? addDefault(file.path, path, { nameHint: methodName })
         : addNamed(file.path, methodName, path);
-      if (style === true) {
+      if (this.customStyleName) {
+        const stylePath = winPath(this.customStyleName(transformedMethodName));
+        addSideEffect(file.path, `${stylePath}`);
+      } else if (this.styleLibraryDirectory) {
+        const stylePath = winPath(
+          join(this.libraryName, this.styleLibraryDirectory, transformedMethodName, this.fileName)
+        );
+        addSideEffect(file.path, `${stylePath}`);
+      } else if (style === true) {
         addSideEffect(file.path, `${path}/style`);
       } else if (style === 'css') {
         addSideEffect(file.path, `${path}/style/css`);
diff --git a/src/index.js b/src/index.js
index 35a69612..cb5484ad 100644
--- a/src/index.js
+++ b/src/index.js
@@ -26,6 +26,8 @@ export default function ({ types }) {
             libraryName,
             libraryDirectory,
             style,
+            styleLibraryDirectory,
+            customStyleName,
             camel2DashComponentName,
             camel2UnderlineComponentName,
             fileName,
@@ -37,6 +39,8 @@ export default function ({ types }) {
               libraryName,
               libraryDirectory,
               style,
+              styleLibraryDirectory,
+              customStyleName,
               camel2DashComponentName,
               camel2UnderlineComponentName,
               fileName,
@@ -53,6 +57,8 @@ export default function ({ types }) {
               opts.libraryName,
               opts.libraryDirectory,
               opts.style,
+              opts.styleLibraryDirectory,
+              opts.customStyleName,
               opts.camel2DashComponentName,
               opts.camel2UnderlineComponentName,
               opts.fileName,