importmap-resolver
This package is for resolving module names with importmap
.
Installation
npm install --save-dev importmap-resolver
Command Line Usage
importmap
file
Create an First, create the file .importmap.yaml
or .importmap.yml
. This package searches it from the working directory toward the root and uses the first found one.
You can use regular expressions as well as strings in the map. Note its order because the mappings written earlier are preferred.
# Mapping with strings
a: https://example-a.ex/a.js
b: https://example-b.ex/b.js
# Mapping with the regular expressions
(.+): https://example-$1.ex/$1.js
Also, note that YAML distinguishes between strings, numbers, etc. Therefore, 1: 2
must be written as '1': '2'
.
Execute command
importmap <include-path> [options]
If a directory path is specified, search files under it with the extension .js
or .mjs
recursively.
Options
-
--minify
: Enable code minification. -
--ecma <version>
: Specify an ECMAScript version such as 5, 2015, etc. It helps to optimize code minification.
API Usage
First, load this package with the following import statement.
import { resolve, replace, execute } from "importmap-resolver";
Functions
-
resolve(moduleName: string): string
Convert the module name to resolved one.
-
replace(code: string): string
Convert module names in the code to resolved ones.
-
execute(includePath: string, shouldMinify = false, minifyOptions?: object): void
The command process uses this function. The minify options are only available from API.
Loading AMD (Asynchronous Module Definition)
This package can convert the import statements loading AMD. Meet these conditions to use this feature.
- Resolved module names (URL or GET parameter) include the string
amd
orumd
sandwiched between the symbols. - Specified modules output the variable declared in each import statement.
See the following examples for more information.
// 'react.js' outputs 'React'
import React from './amd/react.js'
import * as React from './amd/react.js'
// ↓
import './amd/react.js'
// 'react.umd.js' outputs 'useState'
import { useState } from './react.umd.js'
// ↓
import './react.umd.js'
// 'react.js' outputs 'React'
import React, { useState as ustate } from './react.js?amd';
// ↓
import './react.js?amd'; const { useState: ustate } = React;
// 'react.js' outputs 'React'
import React, * as react from './react.js?name=val&module=umd';
// ↓
import './react.js?name=val&module=umd'; const react = React;