[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/import#namespace_import [Back]  [Original]

import - JavaScript | MDN

MDN Web Docs

View in English Always switch to English

import

Baseline *

20185

*

import

import HTML type="module" <script>

import() type="module"

js
import defaultExport from "module-name";
import * as name from "module-name";
import { export1 } from "module-name";
import { export1 as alias1 } from "module-name";
import { default as alias } from "module-name";
import { export1, export2 } from "module-name";
import { export1, export2 as alias2, /*  */ } from "module-name";
import { "string name" as alias } from "module-name";
import defaultExport, { export1, /*  */ } from "module-name";
import defaultExport, * as name from "module-name";
import "module-name";
defaultExport

JavaScript

module-name

URLimport.meta.url URL Nodebundlers

name

JavaScript

exportN

module-name

aliasN

JavaScript

"module-name" with

import import type="module" <script> evalnew Function SyntaxError

let const class function var import

import await

import

import 4

  • import: import { export1, export2 } from "module-name";
  • import: import defaultExport from "module-name";
  • import: import * as name from "module-name";
  • import: import "module-name";

import

my-module myExport export * from "another.js" export myExport

js
import { myExport } from "/modules/my-module.js";

js
import { foo, bar } from "/modules/my-module.js";

shortName

js
import { reallyReallyLongModuleExportName as shortName } from "/modules/my-module.js";

js
// /modules/my-module.js
const a = 1;
export { a as "a-b" };
js
import { "a-b" as a } from "/modules/my-module.js";

: import { x, y } from "mod" import defaultExport from "mod" defaultExport x y JavaScript

import

js
import myDefault from "/modules/my-module.js";

js
import myDefault, * as myModule from "/modules/my-module.js";
// myModule.default  myDefault 

js
import myDefault, { foo, bar } from "/modules/my-module.js";

default default

js
import { default as myDefault } from "/modules/my-module.js";

import

/modules/my-module.js myModule

js
import * as myModule from "/modules/my-module.js";

myModule doAllTheAmazingThings() :

js
myModule.doAllTheAmazingThings();

myModule null default

: JavaScript import * from "module-name"

js
import "/modules/my-module.js";

js
myModule.doAllTheAmazingThings(); // myModule.doAllTheAmazingThings 

import * as myModule from "/modules/my-module.js";

ECMAScript Node.jsDeno HTML

HTML Node 3

  • /./../ URL
  • URL

CommonJS 1 CommonJS main.js utils/index.js utils/index.js

js
// main.js
const utils = require("./utils"); // "index.js" 
const utils = require("./utils/index"); // ".js" 
const utils = require("./utils/index.js"); // 

import x from "./utils" utilsutils/index.jsutils.js URL HTML URL URL index.js Node.js ESM ECMAScript

import x from "./utils" URL HTML

URL

  • HTTP URL HTTP URL Deno Deno HTTP URL Node HTTPS

  • file: URL Node file: URL

  • data URL NodeDeno MIME JavaScript text/javascriptJSON application/jsonWebAssembly application/wasm import

    js
    // HTTP URL
    import x from "https://example.com/x.js";
    // data URL
    import x from "data:text/javascript,export default 42;";
    // JSON  data URL
    import x from 'data:application/json,{"foo":42}' with { type: "json" };
    

    text/javascript data URL data: URL import x from "data:text/javascript,import y from './y.js';" './y.js'

  • node: URL Node.js Node Bun Node

CommonJS node_modules import x from "foo" node_modules foo import maps

HTML import.meta.resolve

js
// getPrimes.js
/**
 * `max` 
 */
export function getPrimes(max) {
  const isPrime = Array.from({ length: max }, () => true);
  isPrime[0] = isPrime[1] = false;
  isPrime[2] = true;
  for (let i = 2; i * i < max; i++) {
    if (isPrime[i]) {
      for (let j = i ** 2; j < max; j += i) {
        isPrime[j] = false;
      }
    }
  }
  return [...isPrime.entries()]
    .filter(([, isPrime]) => isPrime)
    .map(([number]) => number);
}
js
import { getPrimes } from "/modules/getPrimes.js";

console.log(getPrimes(10)); // [2, 3, 5, 7]

js
// my-module.js
export let myValue = 1;
setTimeout(() => {
  myValue = 2;
}, 500);
js
// main.js
import { myValue } from "/modules/my-module.js";
import * as myModule from "/modules/my-module.js";

console.log(myValue); // 1
console.log(myModule.myValue); // 1
setTimeout(() => {
  console.log(myValue); // 2; my-module has updated its value
  console.log(myModule.myValue); // 2
  myValue = 3; // TypeError: Assignment to constant variable.
  // 
}, 1000);

JavaScript

JavaScript import import JSON type: "json"

js
import data from "./data.json" with { type: "json" };

ECMAScript 2027 LanguageSpecification
# sec-imports


Web Proxy Viewer  |  New URL  |  Original Page