https://github.com/miketamis/babel-plugin-hash-resolve

Lets you use #Paths instead of '../../../lib/helper.js' it becomes just '#/lib/helper.js'
https://github.com/miketamis/babel-plugin-hash-resolve

Last synced: 3 months ago
JSON representation

Lets you use #Paths instead of '../../../lib/helper.js' it becomes just '#/lib/helper.js'

• Host: GitHub
• URL: https://github.com/miketamis/babel-plugin-hash-resolve
• Owner: miketamis
• Created: 2018-06-03T23:35:42.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2020-04-28T22:58:18.000Z (over 4 years ago)
• Last Synced: 2024-07-17T15:43:44.864Z (4 months ago)
• Language: JavaScript
• Size: 3.91 KB
• Stars: 7
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-babel - hash-resolve - Allows you to use `require('#/path')` instead of `require('../../path')`, the number of `../` needed is worked out by the plugin (Plugins / Module Resolution)

README

        
# babel-plugin-hash-resolve

Sick of all those `require('../../../something.js')`  We all are.

heres another differnet solution to that problem, I call it #paths

instead of

```js

import React, { Component } from 'react'

import Container from '../../shared-components/Container'

import { colors, fillFields } from '../../shared-components/helpers'

import SearchBox from '../../shared-components/SearchBox'

```

it would be

```js

import React, { Component } from 'react'

import Container from '#/shared-components/Container'

import { colors, fillFields } from '#/shared-components/helpers'

import SearchBox from '#/shared-components/SearchBox'

```

## 1. - How does it work:

It goes up the up the path, ie if the file is located src/components/SearchComponent/index.js

it would start by looking for

`src/components/SearchComponent/shared-components/SearchBox -> ./`

then:

`src/components/shared-components/SearchBox -> ../`

then:

`src/shared-components/SearchBox -> ../../`

which is where the file exists. and therefore the path will be ../../ when compiled.

## How to install:

`npm i --save babel-plugin-hash-resolve` or `yarn add babel-plugin-hash-resolve`

```json

// .babelrc

"plugins": [

    "babel-plugin-hash-resolve"

]

```

if your using eslint you may need to turn these off:

```

 'import/no-unresolved': 'off',

 'import/extensions': 'off'

```

## Other Options:

* https://github.com/patrick-steele-idem/app-module-path-node

* https://lostechies.com/derickbailey/2014/02/20/how-i-work-around-the-require-problem-in-nodejs/

If you got a differnt solutions to this problem pull request and add it to this list.

## Why I like this method: