https://github.com/imjuni/alias-help
https://github.com/imjuni/alias-help
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/imjuni/alias-help
- Owner: imjuni
- License: mit
- Created: 2021-06-18T02:01:19.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2021-06-22T06:26:07.000Z (about 5 years ago)
- Last Synced: 2024-10-19T10:27:06.721Z (over 1 year ago)
- Language: TypeScript
- Size: 105 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# alias-help
alias-help help module resolution config convert from tsconfig.json to webpack.config.*.js.
# Usage
```js
const aliasHelp = require('alias-help');
const config = {
resolve: {
extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'],
alias: aliasHelp({ configFile: 'tsconfig.json' }),
plugins: [
new tsconfigPathsWebpackPlugin({
configFile: 'tsconfig.json',
}),
],
fallback: {
__dirname: false,
__filename: false,
console: false,
global: false,
process: false,
},
},
}
```
# Caution
Little bit difference between webpack module resolution configuration and typescript module resolution configuration. typescript module resolution configuration can do group by several directory.
* typescript can do this but webpack don't.
```json
{
"compilerOptions": {
"paths": {
"@avengers/*": [
"src/iconman/*",
"src/hulk/*"
]
}
}
}
```
## Important
Follow [webpack official document](https://webpack.js.org/configuration/resolve/) that can pass string array but only works in webpack5.
So alias-help can do convertion for webpack5. See below.
### AS-IS tsconfig.json
```json
{
"compilerOptions": {
"paths": {
"@avengers/*": [
"src/iconman/*",
"src/hulk/*"
]
}
}
}
```
### TO-BE json object for webpack5
```
{
'@avengers': [
'src/iconman',
'src/hulk'
]
}
```
# Convertion example
in tsconfig.json
```
{
"@src/*": ["src/*"],
"@samsubdir/*": ["src/sample-sub-dir/*"],
"@samdir/*": ["../sample-dir/*"]
}
```
to webpack.config.*.js
```
{
'@src': 'src',
'@samsubdir': 'src/sample-sub-dir',
'@samdir': '../sample-dir',
}
```
# Note
You can use extended tsconfig.json file. You have tsconfig.base.json and tsconfig.json file extend that whatever tsconfig extension not a problem. Because alias-help use typescript library for read tsconfig.json.