chushihua

This commit is contained in:
li
2026-01-26 23:20:48 +08:00
commit 7b5aab0206
22521 changed files with 3300090 additions and 0 deletions
+139
View File
@@ -0,0 +1,139 @@
# babel-plugin-component
[![NPM version](https://img.shields.io/npm/v/babel-plugin-component.svg)](https://npmjs.org/package/babel-plugin-component)
[![Build Status](https://travis-ci.org/ElementUI/babel-plugin-component.svg?branch=master)](https://travis-ci.org/ElementUI/babel-plugin-component)
[![Coverage Status](https://coveralls.io/repos/github/QingWei-Li/babel-plugin-component/badge.svg?branch=master)](https://coveralls.io/github/QingWei-Li/babel-plugin-component?branch=master)
## Install
```shell
npm i babel-plugin-component -D
# For babel6
npm i babel-plugin-component@0 -D
```
## Example
Converts
```javascript
import { Button } from 'components'
```
to
```javascript
var button = require('components/lib/button')
require('components/lib/button/style.css')
```
## styleLibraryName Example
Converts
```javascript
import Components from 'components'
import { Button } from 'components'
```
to
```javascript
require('components/lib/styleLibraryName/index.css')
var button = require('components/lib/styleLibraryName/button.css')
```
## Usage
Via `.babelrc` or babel-loader.
```javascript
{
"plugins": [["component", options]]
}
```
## Multiple Module
```javascript
{
"plugins": [xxx,
["component", {
libraryName: "antd",
style: true,
}, "antd"],
["component", {
libraryName: "test-module",
style: true,
}, "test-module"]
]
}
```
### Component directory structure
```
- lib // 'libDir'
- index.js // or custom 'root' relative path
- style.css // or custom 'style' relative path
- componentA
- index.js
- style.css
- componentB
- index.js
- style.css
```
### Theme library directory structure
```
- lib
- theme-default // 'styleLibraryName'
- base.css // required
- index.css // required
- componentA.css
- componentB.css
- theme-material
- ...
- componentA
- index.js
- componentB
- index.js
```
or
```
- lib
- theme-custom // 'styleLibrary.name'
- base.css // if styleLibrary.base true
- index.css // required
- componentA.css // default
- componentB.css
- theme-material
- componentA
-index.css // styleLibrary.path [module]/index.css
- componentB
-index.css
- componentA
- index.js
- componentB
- index.js
```
### options
- `["component"]`: import js modularly
- `["component", { "libraryName": "component" }]`: module name
- `["component", { "styleLibraryName": "theme_package" }]`: style module name
- `["component", { "styleLibraryName": "~independent_theme_package" }]`: Import a independent theme package
- `["component", { "styleLibrary": {} }]`: Import a independent theme package with more config
```
styleLibrary: {
"name": "xxx", // same with styleLibraryName
"base": true, // if theme package has a base.css
"path": "[module]/index.css", // the style path. e.g. module Alert => alert/index.css
"mixin": true // if theme-package not found css file, then use [libraryName]'s css file
}
```
- `["component", { "style": true }]`: import js and css from 'style.css'
- `["component", { "style": cssFilePath }]`: import style css from filePath
- `["component", { "libDir": "lib" }]`: lib directory
- `["component", { "root": "index" }]`: main file dir
- `["component", { "camel2Dash": false }]`: whether parse name to dash mode or not, default `true`
+294
View File
@@ -0,0 +1,294 @@
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _require = require('@babel/helper-module-imports'),
addSideEffect = _require.addSideEffect,
addDefault = _require.addDefault;
var resolve = require('path').resolve;
var isExist = require('fs').existsSync;
var cache = {};
var cachePath = {};
var importAll = {};
module.exports = function core(defaultLibraryName) {
return function (_ref) {
var types = _ref.types;
var specified;
var libraryObjs;
var selectedMethods;
var moduleArr;
function parseName(_str, camel2Dash) {
if (!camel2Dash) {
return _str;
}
var str = _str[0].toLowerCase() + _str.substr(1);
return str.replace(/([A-Z])/g, function ($1) {
return "-".concat($1.toLowerCase());
});
}
function importMethod(methodName, file, opts) {
if (!selectedMethods[methodName]) {
var options;
var path;
if (Array.isArray(opts)) {
options = opts.find(function (option) {
return moduleArr[methodName] === option.libraryName || libraryObjs[methodName] === option.libraryName;
}); // eslint-disable-line
}
options = options || opts;
var _options = options,
_options$libDir = _options.libDir,
libDir = _options$libDir === void 0 ? 'lib' : _options$libDir,
_options$libraryName = _options.libraryName,
libraryName = _options$libraryName === void 0 ? defaultLibraryName : _options$libraryName,
_options$style = _options.style,
style = _options$style === void 0 ? true : _options$style,
styleLibrary = _options.styleLibrary,
_options$root = _options.root,
root = _options$root === void 0 ? '' : _options$root,
_options$camel2Dash = _options.camel2Dash,
camel2Dash = _options$camel2Dash === void 0 ? true : _options$camel2Dash;
var styleLibraryName = options.styleLibraryName;
var _root = root;
var isBaseStyle = true;
var modulePathTpl;
var styleRoot;
var mixin = false;
var ext = options.ext || '.css';
if (root) {
_root = "/".concat(root);
}
if (libraryObjs[methodName]) {
path = "".concat(libraryName, "/").concat(libDir).concat(_root);
if (!_root) {
importAll[path] = true;
}
} else {
path = "".concat(libraryName, "/").concat(libDir, "/").concat(parseName(methodName, camel2Dash));
}
var _path = path;
selectedMethods[methodName] = addDefault(file.path, path, {
nameHint: methodName
});
if (styleLibrary && _typeof(styleLibrary) === 'object') {
styleLibraryName = styleLibrary.name;
isBaseStyle = styleLibrary.base;
modulePathTpl = styleLibrary.path;
mixin = styleLibrary.mixin;
styleRoot = styleLibrary.root;
}
if (styleLibraryName) {
if (!cachePath[libraryName]) {
var themeName = styleLibraryName.replace(/^~/, '');
cachePath[libraryName] = styleLibraryName.indexOf('~') === 0 ? resolve(process.cwd(), themeName) : "".concat(libraryName, "/").concat(libDir, "/").concat(themeName);
}
if (libraryObjs[methodName]) {
/* istanbul ingore next */
if (cache[libraryName] === 2) {
throw Error('[babel-plugin-component] If you are using both' + 'on-demand and importing all, make sure to invoke the' + ' importing all first.');
}
if (styleRoot) {
path = "".concat(cachePath[libraryName]).concat(styleRoot).concat(ext);
} else {
path = "".concat(cachePath[libraryName]).concat(_root || '/index').concat(ext);
}
cache[libraryName] = 1;
} else {
if (cache[libraryName] !== 1) {
/* if set styleLibrary.path(format: [module]/module.css) */
var parsedMethodName = parseName(methodName, camel2Dash);
if (modulePathTpl) {
var modulePath = modulePathTpl.replace(/\[module]/ig, parsedMethodName);
path = "".concat(cachePath[libraryName], "/").concat(modulePath);
} else {
path = "".concat(cachePath[libraryName], "/").concat(parsedMethodName).concat(ext);
}
if (mixin && !isExist(path)) {
path = style === true ? "".concat(_path, "/style").concat(ext) : "".concat(_path, "/").concat(style);
}
if (isBaseStyle) {
addSideEffect(file.path, "".concat(cachePath[libraryName], "/base").concat(ext));
}
cache[libraryName] = 2;
}
}
addDefault(file.path, path, {
nameHint: methodName
});
} else {
if (style === true) {
addSideEffect(file.path, "".concat(path, "/style").concat(ext));
} else if (style) {
addSideEffect(file.path, "".concat(path, "/").concat(style));
}
}
}
return selectedMethods[methodName];
}
function buildExpressionHandler(node, props, path, state) {
var file = path && path.hub && path.hub.file || state && state.file;
props.forEach(function (prop) {
if (!types.isIdentifier(node[prop])) return;
if (specified[node[prop].name]) {
node[prop] = importMethod(node[prop].name, file, state.opts); // eslint-disable-line
}
});
}
function buildDeclaratorHandler(node, prop, path, state) {
var file = path && path.hub && path.hub.file || state && state.file;
if (!types.isIdentifier(node[prop])) return;
if (specified[node[prop].name]) {
node[prop] = importMethod(node[prop].name, file, state.opts); // eslint-disable-line
}
}
return {
visitor: {
Program: function Program() {
specified = Object.create(null);
libraryObjs = Object.create(null);
selectedMethods = Object.create(null);
moduleArr = Object.create(null);
},
ImportDeclaration: function ImportDeclaration(path, _ref2) {
var opts = _ref2.opts;
var node = path.node;
var value = node.source.value;
var result = {};
if (Array.isArray(opts)) {
result = opts.find(function (option) {
return option.libraryName === value;
}) || {};
}
var libraryName = result.libraryName || opts.libraryName || defaultLibraryName;
if (value === libraryName) {
node.specifiers.forEach(function (spec) {
if (types.isImportSpecifier(spec)) {
specified[spec.local.name] = spec.imported.name;
moduleArr[spec.imported.name] = value;
} else {
libraryObjs[spec.local.name] = value;
}
});
if (!importAll[value]) {
path.remove();
}
}
},
CallExpression: function CallExpression(path, state) {
var node = path.node;
var file = path && path.hub && path.hub.file || state && state.file;
var name = node.callee.name;
if (types.isIdentifier(node.callee)) {
if (specified[name]) {
node.callee = importMethod(specified[name], file, state.opts);
}
} else {
node.arguments = node.arguments.map(function (arg) {
var argName = arg.name;
if (specified[argName]) {
return importMethod(specified[argName], file, state.opts);
} else if (libraryObjs[argName]) {
return importMethod(argName, file, state.opts);
}
return arg;
});
}
},
MemberExpression: function MemberExpression(path, state) {
var node = path.node;
var file = path && path.hub && path.hub.file || state && state.file;
if (libraryObjs[node.object.name] || specified[node.object.name]) {
node.object = importMethod(node.object.name, file, state.opts);
}
},
AssignmentExpression: function AssignmentExpression(path, _ref3) {
var opts = _ref3.opts;
if (!path.hub) {
return;
}
var node = path.node;
var file = path.hub.file;
if (node.operator !== '=') return;
if (libraryObjs[node.right.name] || specified[node.right.name]) {
node.right = importMethod(node.right.name, file, opts);
}
},
ArrayExpression: function ArrayExpression(path, _ref4) {
var opts = _ref4.opts;
if (!path.hub) {
return;
}
var elements = path.node.elements;
var file = path.hub.file;
elements.forEach(function (item, key) {
if (item && (libraryObjs[item.name] || specified[item.name])) {
elements[key] = importMethod(item.name, file, opts);
}
});
},
Property: function Property(path, state) {
var node = path.node;
buildDeclaratorHandler(node, 'value', path, state);
},
VariableDeclarator: function VariableDeclarator(path, state) {
var node = path.node;
buildDeclaratorHandler(node, 'init', path, state);
},
LogicalExpression: function LogicalExpression(path, state) {
var node = path.node;
buildExpressionHandler(node, ['left', 'right'], path, state);
},
ConditionalExpression: function ConditionalExpression(path, state) {
var node = path.node;
buildExpressionHandler(node, ['test', 'consequent', 'alternate'], path, state);
},
IfStatement: function IfStatement(path, state) {
var node = path.node;
buildExpressionHandler(node, ['test'], path, state);
buildExpressionHandler(node.test, ['left', 'right'], path, state);
}
}
};
};
};
+1
View File
@@ -0,0 +1 @@
module.exports = require('./core')('element-ui');
+59
View File
@@ -0,0 +1,59 @@
{
"name": "babel-plugin-component",
"version": "1.1.1",
"description": "Modular build plugin for babel.",
"main": "lib/index.js",
"scripts": {
"build": "rm -rf lib && babel src --out-dir lib --ignore __tests__",
"test": "mocha --require @babel/register",
"debug": "mocha --require @babel/register --require @babel/polyfill --no-timeouts",
"lint": "eslint --ext .js src",
"coveralls": "cat ./coverage/lcov.info | coveralls",
"prepublish": "npm run build"
},
"pre-commit": [
"lint"
],
"keywords": [
"babel-plugin"
],
"author": [
"chencheng <sorrycc@gmail.com>",
"qingwei-li <cinwell.li@gmail.com>"
],
"license": "MIT",
"devDependencies": {
"@babel/cli": "7.0.0-beta.35",
"@babel/core": "7.0.0-beta.35",
"@babel/node": "7.0.0-beta.35",
"@babel/preset-env": "7.0.0-beta.35",
"@babel/preset-react": "7.0.0-beta.35",
"@babel/preset-stage-0": "7.0.0-beta.35",
"@babel/register": "7.0.0-beta.35",
"coveralls": "^2.11.6",
"eslint": "^2.7.0",
"eslint-config-airbnb": "^6.2.0",
"expect": "^1.13.4",
"mocha": "4.0.1",
"pre-commit": "~1.1.2"
},
"repository": "ElementUI/babel-plugin-component",
"homepage": "https://github.com/ElementUI/babel-plugin-component#readme",
"bugs": {
"url": "https://github.com/ElementUI/babel-plugin-component/issues"
},
"babel": {
"presets": [
"@babel/preset-env",
"@babel/preset-react"
]
},
"files": [
"lib",
"package.json",
"README.md"
],
"dependencies": {
"@babel/helper-module-imports": "7.0.0-beta.35"
}
}