simple-import-replacement v1.0.14
Simple Import Replacement
A script to replace relative imports with absolute imports in TypeScript, JavaScript, and CSS files.
Description
This script processes files in your current directory (or a specified one) and its subdirectories, converting relative import paths to absolute import paths. It supports ts, tsx, js, jsx, css, scss, less, and sass file extensions.
Installation
Local Installation
You can install the package locally as a development dependency:
npm install --save-dev simple-import-replacementor using yarn:
yarn add --dev simple-import-replacementGlobal Installation
You can install the package globally:
npm install -g simple-import-replacementor using yarn:
yarn global add simple-import-replacementUsing npx
You can run the script directly using npx without installing it:
npx simple-import-replacementUsage
Local Installation
Add a script to your package.json:
{
"scripts": {
"replace-imports": "simple-import-replacement"
}
}Run the script:
npm run replace-importsor using yarn:
yarn replace-importsGlobal Installation
Run the script directly:
replace-importsUsing npx
Run the script using npx:
npx simple-import-replacementAdditional Examples
Default behavior
Scan for **/*.{ts,tsx,js,jsx,css,scss,less,sass} files in the current directory and its subdirectories:
npx simple-import-replacementSpecify a root directory
npx simple-import-replacement --root-dir=/path/to/your/project/srcor
npx simple-import-replacement /path/to/your/project/srcSpecify a root directory and custom file patterns
npx simple-import-replacement /path/to/your/project/src **/*.ts **/*.js **/*.cssExample
Suppose you have a project structure as follows:
/path/to/your/project/src/
├── com/
│ ├── test/
│ │ ├── foo/
│ │ │ ├── bar/
│ │ │ │ └── example.ts
│ │ │ └── another/
│ │ │ └── anotherThing.ts
│ └── components/
│ └── MyComponent.ts
│ └── styles.cssAnd your example.ts file contains the following imports:
import something from './something';
import anotherThing from '../another/anotherThing';
import React from 'react';
export { MyComponent } from '../../components/MyComponent';And your styles.css file contains:
@import './variables.css';
@import '../components/common.css';Running the script:
npx simple-import-replacementwill update example.ts to:
import something from 'com/test/foo/bar/something';
import anotherThing from 'com/test/foo/another/anotherThing';
import React from 'com/test/foo/bar/something';
export { MyComponent } from 'com/components/MyComponent';and styles.css to:
@import 'com/test/foo/bar/variables.css';
@import 'com/components/common.css';Supported File Types
The script now supports the following file types:
- TypeScript (.ts, .tsx)
- JavaScript (.js, .jsx)
- CSS (.css)
- SCSS (.scss)
- Less (.less)
- Sass (.sass)
It will process both import statements in TypeScript/JavaScript files and @import rules in CSS and other stylesheet files.
Contributing
Feel free to open issues or submit pull requests if you find bugs or have suggestions for improvements.
License
This project is licensed under the MIT License.