fix: only import file when exits

Author: wuhaolin

README.md

@@ -53,7 +53,8 @@ module.exports = {
 - **lib**: library want to replace,value is name in npm.
 - **libDir**: library directory path which store will use code, default it `lib`  
 - **style**: should append style file to a component? value is relative path to style file.
-- **camel2**: should translate MyComponent to my-component, value is the join string. 
+- **camel2**: should translate MyComponent to my-component, value is the join string.
+- **existCheck**: should check if import file exist, only import file when exits, default will check. To close this check set `existCheck=null`.
 
 ## Diff with babel-plugin-import
 1. babel-plugin-import is a babel plugin, which means must be used in project with babel.

lib/util.js

@@ -1,4 +1,5 @@
 const path = require('path');
+const {existsSync} = require('fs');
 // 用于匹配 import { Button } from 'antd';
 const importReg = /import\s+{\s*(.+)\s*}\s+from\s+['"](.+)['"]/g;
 
@@ -12,12 +13,21 @@ function tranCamel2(componentName, joinString) {
   return componentName.replace(/([a-z])([A-Z])/g, `$1${joinString}$2`).toLowerCase();
 }
 
+/**
+ * file exists in node_modules?
+ * @param filePath
+ */
+function fileExistInNpm(filePath) {
+  return existsSync(path.resolve(__dirname, '../../', filePath));
+}
+
 function replaceImport(source, options = {}) {
   const {
     lib,// lib name
     libDir = 'lib', //lib dir in npm
     style, // style file path
     camel2, // translate ComponentName to component-name | component_name
+    existCheck = fileExistInNpm,// only import file when exits
   } = options;
   if (!lib) {
     return source;
@@ -34,10 +44,18 @@ function replaceImport(source, options = {}) {
         }
 
         if (componentName.length > 0) {
-          ret += `import ${componentName} from '${path.join(importFrom, libDir, componentPath)}'\n`;
+          // import js file
+          const jsFilePath = path.join(importFrom, libDir, componentPath);
+          if (typeof existCheck !== 'function' || existCheck(jsFilePath)) {
+            ret += `import ${componentName} from '${jsFilePath}'\n`;
+          }
 
           if (style) {
-            ret += `import '${path.join(importFrom, libDir, componentPath, style)}'\n`;
+            // import style file
+            const styleFilePath = path.join(importFrom, libDir, componentPath, style);
+            if (typeof existCheck !== 'function' || existCheck(styleFilePath)) {
+              ret += `import '${styleFilePath}'\n`;
+            }
           }
         }
       });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-component-loader",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "main": "./lib/index.js",
   "engines": {
     "node": ">= 6.0.0"
@@ -12,6 +12,7 @@
     "webpack": "*"
   },
   "devDependencies": {
+    "antd": "^2.13.4",
     "mocha": "^3.5.3"
   }
 }

test/index.test.js

@@ -100,11 +100,22 @@ import 'antd/lib/Icon/index.css'
         camel2: '-'
       },
     },
+    {
+      des: '使用 camel2 转化大小写',
+      source: `import {Button} from 'antd'`,
+      output: `import Button from 'antd/lib/button'\n`,
+      options: {
+        lib: 'antd',
+        camel2: '-'
+      },
+    },
   ];
 
-  testData.forEach(({des, source, output, options}) => {
+  testData.forEach(({des, source, output, options = {}}) => {
     it(des, function () {
-      let realOutput = replaceImport(source, options);
+      let realOutput = replaceImport(source, Object.assign(options, {
+        existCheck: null
+      }));
       assert.equal(realOutput, output, `
         source=${source}
         options=${JSON.stringify(options)}