For questions about the `import` keyword for ES6 modules
import forms part of the ES6 module specification and is documented on MDN.
Questions tagged [javascript-import]
124 questions
81
votes
2 answers
ES6 import equivalent of require() without exports
By using require(./filename) I can include and execute the code inside filename without any export defined inside filename itself.
What is the equivalent in ES6 using import ?
Thanks
crash
- 4,152
- 6
- 33
- 54
28
votes
2 answers
How does JavaScript import find the module without an extension?
I understand that we can use import {x} from "./file" and a variable x will be imported from file.js in the same directory. How is this handled if there are files of the same name with different extensions in the directory?
For example, if there…
curiousgeorge
- 593
- 1
- 5
- 14
18
votes
4 answers
why node uses require not import?
I'm learning node.js and am wondering why it uses the require syntax rather than the import syntax which React uses.
i.e.
const Validator = require("validator");
VS
import Validator from "validator";
I believed import is es6 but I don't think that…
Holly
- 7,462
- 23
- 86
- 140
12
votes
3 answers
Access a Global Variable in Main File with an Imported Javascript Function ES6
I am using Vue.js but with simply JS files and not vue files and I am importing a component into my main app.js like so:
import autoPosts from './components/autoPosts.js';
It imports it just fine, but I am trying to access these globals. Before…
Nate Beers
- 1,355
- 2
- 13
- 22
12
votes
8 answers
When do we use '{ }' in javascript imports?
I am learning Javascript imports and I am yet to understand when we use curly braces while importing items(functions, objects, variables) from another JS file.
import Search from './models/Search';
import * as searchView from…
Bony
- 151
- 2
- 8
9
votes
2 answers
Import jQuery Validation
I want to import 'jquery-validation' into an ES6 class
import $ from 'jquery'
import 'jquery-validation'
but when I do anywhere in the same file
$(...).validate({...})
I get the error
Uncaught TypeError: $(...).validate is not a function
philip_nunoo
- 920
- 3
- 10
- 21
7
votes
2 answers
Using SweetAlert2 with TypeScript, could not find a declaration file for module 'sweetalert2/dist/sweetalert2.js'
I'm migrating one of my projects to TypeScript, in that project SweetAlert2 library is used.
The default way to import SweetAlert2 (both JS and CSS) is
import Swal from 'sweetalert2'
This works fine with TypeScript because there are types in the…
Limon Monte
- 52,539
- 45
- 182
- 213
6
votes
4 answers
Mock out imported Lazy React component
Here's my lazy component:
const LazyBones = React.lazy(() => import('@graveyard/Bones')
.then(module => ({default: module.BonesComponent}))
export default LazyBones
I'm importing it like this:
import Bones from './LazyBones'
export default () =>…
AncientSwordRage
- 7,086
- 19
- 90
- 173
5
votes
2 answers
I get "TypeError: $ is not a function" when using "import * as jQuery"
I have the following JavaScript, which executes without any errors or warnings:
import * as jQuery from './node_modules/jquery/dist/jquery.min.js';
window.$ = jQuery;
... but when I try to use my new $() function ...
$(document).ready(function() {
…
Mayor of the Plattenbaus
- 974
- 3
- 34
- 69
5
votes
0 answers
InversifyJS binding decorators and lazy inject
I use InversifyJS with binding and lazy inject decorators and I'm getting the next error:
No matching bindings found for serviceIdentifier: Symbol(ClassB)
Here's the code:
inversify.config.ts
import { Container } from 'inversify';
import…
Arty Dev
- 111
- 1
- 7
5
votes
0 answers
How to import another JS file in a Web Worker?
I've got a WebWorker in which I want to use functions from another existing JavaScript file. I've tried different methods to import the JS file but so far none have worked. The file in question is in another directory, with relate path…
ryougi1
- 89
- 7
5
votes
1 answer
import all named exports under their export name without explicitly listing them
I have a file modules.js that exports all default exports from my modules by their module name (following ES6 exporting/importing in index file):
export { default as a } from './a/a'
export { default as b } from './b/b'
...
export { default as y }…
connexo
- 53,704
- 14
- 91
- 128
5
votes
0 answers
Dynamic import of webpackChunkName
I'm new to webpack and I wonder if there's a way to add dynamic chunk name and path in an import. I tried doing this, but it's wrong
import(/* webpackChunkName: "${file_name}"*/ './modules/${js_path}')
or
import(/* webpackChunkName:…
Clover
- 51
- 3
5
votes
2 answers
import jquery in angular4
in order to import jquery in an angualr4 project i do the following:
npm install --save jquery
npm install --save-dev @types/jquery
in the app.component.ts
import $ from 'jquery';
or
import * as $ from 'jquery';
when run "ng serve"
i got these…
pinale
- 2,060
- 6
- 38
- 72
4
votes
1 answer
Does require in javascript/nodejs executes same file everytime it is imported in another modules?
Does require() in JavaScript/Node.js executes the same file every time it is imported into other modules?
If yes, how can I have one array in one file and append/update values in it from another JS file?
For example, I have an Array in one file and…
user10400182