# babel-plugin-com-import

> 58组件库com-58-pc按需加载babel插件

Latest version **2.1.3** (published 2019-09-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install babel-plugin-com-import
pnpm add babel-plugin-com-import
yarn add babel-plugin-com-import
bun add babel-plugin-com-import
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.1.3 |
| Published | 2019-09-27 |
| First published | 2019-09-26 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 5.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | daimingyu |

## Links

- npm: https://www.npmjs.com/package/babel-plugin-com-import
- npm.io page: https://npm.io/package/babel-plugin-com-import

## Dependencies (1)

- [babel-types](https://npm.io/package/babel-types.md) ^6.26.0

## Recent versions

- 2.1.3 (latest) — 2019-09-27
- 1.1.3 — 2019-09-26
- 1.1.2 — 2019-09-26
- 1.1.1 — 2019-09-26
- 1.1.10 — 2019-09-26
- 1.0.10 — 2019-09-26
- 1.0.9 — 2019-09-26
- 1.0.8 — 2019-09-26
- 1.0.7 — 2019-09-26
- 1.0.6 — 2019-09-26
- 1.0.5 — 2019-09-26
- 1.0.4 — 2019-09-26
- 1.0.3 — 2019-09-26
- 1.0.2 — 2019-09-26
- 1.0.1 — 2019-09-26
- … 1 more at https://npm.io/package/babel-plugin-com-import/versions

## README

# babel-plugin-com-import

58组件库com-58-pc按需加载babel插件

# 一、基本使用

## 1、安装依赖

```
npm install babel-plugin-com-import --save-dev
```

## 2、在webapck中配置babel-loader
```
module.exports = {
    ...
    module: {
            rules: [
                {
                    test: /\.(js|jsx)?$/,
                    use: "babel-loader",
                    exclude: /node_modules/
                },
            ]
    }
    ...
}
```


## 3、在.babelrc文件中配置

```
{
	"plugins": [
		[
			"com-import",
			{
				"library": "com-58-pc"
			}
		]
	]
}
```

# 二、在create-react-app初始化的项目中使用

## 1、安装依赖

```
npm install babel-plugin-com-import --save-dev
```

## 2、启用`babelrc`配置

create-react-app初始化的项目禁用了babelrc配置文件，所以需要我们修改配置，让babelrc文件起作用，可通过以下几种方法来达到修改配置的目的。

### 直接修改的配置文件

运行`npm run eject`吐出webpack配置文件

找到`config/webpack.config.js`

在该文件中可以看到

![](https://user-gold-cdn.xitu.io/2019/9/26/16d6c98adcd577fa?w=909&h=341&f=png&s=41020)

babelrc被禁用了，可以直接将`false`改为`true`即可。

### 通过`react-app-rewired`重写配置

1、安装`react-app-rewired`

```
npm install react-app-rewired --save-dev
```

2、安装`customize-cra`

```
npm install customize-cra --save-dev
```

3、在项目根目录下创建 `config-overrides.js`

```
+-- your-project
|   +-- config-overrides.js
|   +-- node_modules
|   +-- package.json
|   +-- public
|   +-- README.md
|   +-- src
```

4、 `config-overrides.js`内容如下

```
const { useBabelRc, override } = require('customize-cra')

const config = override(useBabelRc())

module.exports = config
```

5、 修改`package.json`的`scripts`

```
  "scripts": {
    - "build": "react-scripts build",
    + "build": "react-app-rewired build",
  }
```

## 3、最后在项目根目录创建`.babelrc`文件，写入配置内容

```
{
	"plugins": [
		[
			"com-import",
			{
				"library": "com-58-pc"
			}
		]
	]
}
```

---
_Source: https://npm.io/package/babel-plugin-com-import · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._