1. rollup-plugin-typescript-paths
Rollup plugin to automatically resolve TypeScript path aliases.
rollup-plugin-typescript-paths
Package: rollup-plugin-typescript-paths
Created by: simonhaenisch
Last modified: Fri, 22 Dec 2023 10:52:15 GMT
Version: 1.5.0
License: MIT
Downloads: 105,629
Repository: https://github.com/simonhaenisch/rollup-plugin-typescript-paths

Install

npm install rollup-plugin-typescript-paths
yarn add rollup-plugin-typescript-paths

rollup-plugin-typescript-paths

GitHub Workflow Status

Rollup Plugin to automatically resolve path aliases set in the compilerOptions section of tsconfig.json.

Don't use it if you're already using rollup-plugin-typescript. This plugin is only for use cases where your TypeScript code has already been transpiled before rollup runs.

For example, if you have

 // tsconfig.json
{
  "compilerOptions": {
    // ...
    "baseUrl": ".",
    "paths": {
      "@utils": ["src/helpers/utils"]
    }
  }
}
 import { something } from '@utils';

Then this plugin will make sure that rollup knows how to resolve @utils.

Features

  • No config required. 😎
  • Wildcards are supported. 💪
  • Uses nodeModuleNameResolver from the Typescript API. 🤓

Installation

npm install --save-dev rollup-plugin-typescript-paths

Usage

 import { typescriptPaths } from 'rollup-plugin-typescript-paths';

export default {
  // ...
  plugins: [typescriptPaths()],
};

Options

  • absolute: Whether to resolve to absolute paths; defaults to true.
  • nonRelative: Whether to resolve non-relative paths based on tsconfig's baseUrl, even if none of the paths are matched; defaults to false.
  • preserveExtensions: Whether to preserve .ts and .tsx file extensions instead of having them changed to .js; defaults to false.
  • tsConfigPath: Custom path to your tsconfig.json. Use this if the plugin can't seem to find the correct one by itself.
  • transform: If the plugin successfully resolves a path, this function allows you to hook into the process and transform that path before it is returned.

License

MIT.

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin