GoogleChromeLabs / GoogleChromeLabs/native-url
Named exports as default export
- Dominant language
- JavaScript
- Stars
- 286
- Forks
- 11
- PR merge metrics
- No merged PRs in 30d
Description
`native-url` exposes methods thorugh named exports. To get default Node `url` behavior you would need to import entire module contents
```js
import * as url from 'native-url'; // or 'url' if aliased`
```
This is fine for your own code, but dependencies will throw error since they can’t find default export by default, and most 3rd party code using Node `url` depend on that default export to be available.
To fix this, it’s best to make changes to code at compile time to expose every named export as property of object which should be default export.
Here is a Babel plugin code which achieves that:
```js
const babel = require('@babel/core');
const plugin = babel.createConfigItem(({ types: t }) => {
return {
visitor: {
ExportNamedDeclaration(path, parent) {
const properties = path.node.specifiers.map((node) => ({
exported: node.exported.name,
local: node.local.name
}));
path.insertAfter(
t.exportDefaultDeclaration(
t.objectExpression(
properties.map((prop) =>
t.objectProperty(
t.identifier(prop.exported),
t.identifier(prop.local)
)
)
)
)
);
}
}
};
});
```
And here is how you apply it with Webpack:
```js
{
test: /\.m?js$/,
include: /node_modules\/native-url/,
use: [
{
loader: 'babel-loader',
options: {
plugins: [plugin]
}
}
]
};
```
After that you can use both modules’ named exports as default export.
Is this something which should be documented for both Webpack and Rollup, or should `native-url` expose default export by default?
Contributor guide
Research direction
The issue names native-url's named exports, a Babel plugin, and Webpack/Rollup integration, but no repository files or tests. Start by locating the package entry point and build/export configuration, then compare the current default and named import behavior. Done means the default-export compatibility decision is implemented and verified, or the Webpack and Rollup guidance is documented.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- babel, javascript, nodejs, rollup, webpack
- Domain
- backend, build-system
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100