mirror of
https://github.com/jlengrand/open-wc.git
synced 2026-03-10 08:31:19 +00:00
- @open-wc/building-rollup@1.0.0 - @open-wc/building-utils@2.16.3 - @open-wc/building-webpack@2.13.12 - @open-wc/create@0.28.3 - @open-wc/dedupe-mixin@1.2.16 - @open-wc/demoing-storybook@2.0.0 - es-dev-server@1.46.2 - @import-maps/generate@0.2.6 - @import-maps/resolve@0.2.6 - @open-wc/karma-esm@2.13.23 - @open-wc/lit-helpers@0.3.8 - @mdjs/core@0.1.9 - polyfills-loader@1.5.4 - @open-wc/rollup-plugin-html@1.0.0 - rollup-plugin-index-html@1.10.6 - @open-wc/rollup-plugin-polyfills-loader@1.0.0 - @open-wc/scoped-elements@1.0.8 - @open-wc/semantic-dom-diff@0.17.7 - storybook-addon-markdown-docs@0.2.4 - storybook-addon-web-components-knobs@0.3.6 - @open-wc/testing-helpers@1.7.1 - @open-wc/testing-karma-bs@1.3.56 - @open-wc/testing-karma@3.3.12 - @open-wc/testing@2.5.11 - @open-wc/webpack-import-meta-loader@0.4.5 - @open-wc/webpack-index-html-plugin@1.7.6
Resolve import-maps
This will allow you to parse and resolve urls by a given import-map.
Usage
yarn add @import-maps/resolve
You may then override a resolve method in your build process.
import { parseFromString, resolve } from '@import-maps/resolve';
// you probably want to cache the map processing and not redo it for every resolve
// a simple example
const importMapCache = null;
function myResolve(specifier) {
const rootDir = process.cwd();
const basePath = importer ? importer.replace(rootDir, `${rootDir}::`) : `${rootDir}::`;
if (!importMapCache) {
const mapString = fs.readFileSync(path.join(rootDir, 'import-map.json'), 'utf-8');
mapCache = parseFromString(mapString, basePath);
}
const relativeSource = source.replace(rootDir, '');
const resolvedPath = resolve(relativeSource, importMapCache, basePath);
if (resolvedPath) {
return resolvedPath;
}
}
Additional info
The 3rd parameter of resolve is the "baseUrl/basePath" and it's format is /path/to/root::/subdir/foo.
You can compare it with an url http://example.com/subdir/foo.
- Everything before the
::is sort of thedomaine.g.http://example.com/ - Everything after is the path/directory to your appliaction
Such a path is needed as import maps support relative pathes as values.
Acknowledgments
This implementation is heavily based on the import-maps reference implementation. Thanks to @domenic and @guybedford for sharing that prototype.
Some adjustments have been made
- Allow to process/resolve node pathes besides urls
- Use mocha/chai for testing (already available in our setup)