Modular import plugin for babel for server-side rendering. Also works for cjs to delete imported CSS to avoid compilation errors..
npm install babel-plugin-transform-remove-imports --save-dev
Via .babelrc or babel-loader.
{
"plugins": [
[
"babel-plugin-transform-remove-imports", {
"test": "\\.(less|css)$"
}
]
]
}// Input Code import './index.less'; import './index.main.less'; import { Button } from 'uiw'; import { Select } from '@uiw/core'; // Output ↓ ↓ ↓ ↓ ↓ ↓ import { Button } from 'uiw'; import { Select } from '@uiw/core';
Output Result
- import './index.less'; - import './index.main.less'; import { Button } from 'uiw'; import { Select } from '@uiw/core';
Via .babelrc or babel-loader.
{
"plugins": [
[
"babel-plugin-transform-remove-imports", {
"test": "@babel/core",
}
]
]
}// Input Code require('@babel/core'); const jest = require('jest'); // Output ↓ ↓ ↓ ↓ ↓ ↓ var jest = require('jest');
Output Result
- require('@babel/core'); - const jest = require('jest'); + var jest = require('jest');
test: RegExp | string | (RegExp | string)[]
A regular expression to match the imports that will be removed. It could be a string or a RegExp object. You could also pass an array here.
removeAll: boolean
Deletes all imports.
remove?: 'effects'
Removing only side effects imports，Used with the test option. #3
// Input Code import 'foo'; import Foo from 'foo'; // Output Code ↓ ↓ ↓ ↓ ↓ ↓ import Foo from 'foo';
import plugin from 'babel-plugin-transform-remove-imports' import { transform } from 'babel-core' function replace (code) { return transform(code, { babelrc: false, plugins: [ [plugin, { test: /\.(less|css)$/ }] ], }).code; } replace("import './index.main.less';import { Button } from 'uiw';") //=> "import { Button } from 'uiw';"
As always, thanks to our amazing contributors!
Made with github-action-contributors.