I want to use the validator for an express project. How do I import just two subsets of the packages directly?
Like:
import {isEmail, isEmpty} from 'validator';
or importing each on a separate line.
I just want to know if there is another option apart from import validator from 'validator'; as stated on the https://www.npmjs.com/package/validator
const isEmailValidator = require('validator').isEmail;
const isEmptyValidator = require('validator').isEmpty;
isEmailValidator('bla#bla.com');
Like this you mean? What you wrote should also be valid:
import {isEmail, isEmpty} from 'validator';
isEmail('bla#bla.com');
Edit for clarification: As you can see here https://github.com/chriso/validator.js/blob/master/src/index.js the library is exporting an object with each function. You can import everything import validator from 'validator' or you can use destructuring to get only a few properties.
const {isEmail, isEmpty} = require('validator');
This will not actually stop node from importing all of validator though. This just has node load the validator object that is returned from that modules export and then destructures isEmail and isEmpty out of the exported Object.
Maybe whenever ES6 modules become full supported you can use the regular import syntax. See node.js documentation: ECMAScript Modules.
Related
I need to export and import a plain js file to work keyboard navigation correctly.
I am following the example here,and using import and export pattern of ES5 but it is not linking one js file to another.
https://www.w3.org/TR/wai-aria-practices-1.1/examples/menubar/menubar-1/menubar-1.html#
This is my codepen.io link
https://codepen.io/ankita-sharma-the-flexboxer/project/editor/DzdmBE
module.exports = PopupMenu;
var myModule = require('./popuplinks');
There are multiple ways of exporting and importing JavaScript modules, in the past, we were using CommonJS modules which are in a format you've presented, they can be used in following way.
// module.js
const myModule = "something"
module.exports = myModule
// And then if you want to import in another file, you're using following sentence.
const module = require("./module")
Actually we're using ES6-like imports, you can read about them at MDN, I'm attaching a small sample of ES6+ export.
// module.js
const myModule = "Something"
export { myModule }
// And then
import {myModule} from './module'
Actually you should read post that will resolve your issue
tealium-tracker is written in es6 and transpiled using Babel before published to npm.
When consumers do:
import initTealiumTracker from "tealium-tracker";
everything works as expected.
However, some consumers want to use a require instead of an import, and have to append .default:
const initTealiumTracker = require("tealium-tracker).default;
How could I publish the library to avoid appending .default?
I want consumers to be able to do either:
import initTealiumTracker from "tealium-tracker";
or
const initTealiumTracker = require("tealium-tracker);
Source code
In your source code, If you are ok with using commonJS syntax for import and export...
One option would be to replace all import and export with require and module.exports. Looks like webpack doesn't allow mixing the syntaxes (ES6 and commonJS modules).
So your index.js file can require the functions from dependent module as
const { callUtag, flushUtagQueue } = require("./utagCaller");
and export the default function as
module.exports = initTealiumTracker;
module.exports.default = initTealiumTracker;
Likewise your dependent module can export the functions as
module.exports = { callUtag, flushUtagQueue };
This way, consumers should be able to use either
import initTealiumTracker2 from "tealium-tracker";
OR
const initTealiumTracker1 = require("tealium-tracker");
I want to use import in my file, but I cant find the way to replace my require properly
See the code I want to replace
const object = {
first: require('../example/first.json').EXL.PUBLIC,
second: require('../example/second.json').EXL.PUBLIC,
third: require('../example/third.json').EXL.PUBLIC
}
First question is how can I import those stuff directly to an object? Just like I did with require?
The second one, how can I use import with the .EXL.PUBLIC command? To directly import the right branch of the json file?
First question is how can I import those stuff directly to an object?
You can't, you have to import them and then add them to the objct.
The second one, how can I use import with the '.EXL.PUBLIC' command?
You have to import the item, then extract that property.
I'm going to assume you're using Node.js:
v8 through v11
In an .mjs module, you can do it like this:
import firstRoot from "../example/first.json";
import secondRoot from "../example/second.json";
import thirdRoot from "../example/third.json";
const object = {
first: firstRoot.EXL.PUBLIC,
second: secondRoot.EXL.PUBLIC,
third: thirdRoot.EXL.PUBLIC
};
v12
You can still do it as in v11.
If you use ESM with a .js file via the new "type": "module" in package.json, you need to add the --experimental-json-modules flag to enable JSON loading. More about v12's support here, but note that --type isn't yet supported (and if it is, will probably be --entry-type), and the JSON flag is --experimental-json-modules, not --experimental-json-loader).
Say I have these imports:
import clearLineReporter from '../modules/clear-line-reporter';
import karmaReporter from '../modules/karma-reporter';
import metaTestReporter from '../modules/meta-test-reporter';
import stdReporter from '../modules/std-reporter';
import tapJSONReporter from '../modules/tap-json-reporter';
import tapReporter from '../modules/tap-reporter';
import webSocketReporter from '../modules/websocket-reporter';
these must be referenced like I do above, in other words, I obviously can't do this:
const imports = {
stdReporter: import(...),
tapJSONReporter: import(...),
...
webSocketReporter: import(...)
}
Is there any way I can reference imported files through some form of reflection? Because it seems like I can't group them together to reference them somehow.
Instead of import syntax, I could use require(), but I am wondering if there is some way I can do some dynamic things with import statements, for example reference them all dynamically, such that if I add or remove an import, I don't have to change any other code.
There is a great answer to this question that I discovered by asking a different question, here:
exporting imports as a namespace with TypeScript
Create a file name grouped-modules.ts for example, where you want to simply list only the modules and export each one.
export {default as clearLineReporter} from '../modules/clear-line-reporter';
export {default as karmaReporter} from '../modules/karma-reporter';
export {default as metaTestReporter} from '../modules/meta-test-reporter';
...
export {default as stdReporter} from '../modules/std-reporter';
export {default as tapJSONReporter} from '../modules/tap-json-reporter';
Then in your module you can just do :
import * as mods from './grouped-modules'
export {mods}
It will export both types and values in a namespace called s. You can then import them using :
import {mods} from 'your-module'
const anObject: mods.clearLineReporter = ...;
This allows you to dynamically group your modules into one variable.
Is there any way I can reference imported files through some form of reflection?
Answer is dependent on environment, meant in questing, because import statement can be ES native modules implementation in browser, or babel-ed to require statements in node.js, or compile-time resolved bindings in webpack.
So, in each case there is solution to do something reflection. In node.js with babel-ed code import is just require wrapper, so any information is available there.
In browser with native ES modules, all requests to them can be served via ServiceWorker, so it can provide necessary information about fetched ES modules. Also in browser ES modules can be dynamically imported that way: https://matthewphillips.info/posts/loading-app-with-script-module
Most interesting part is webpack: compile-time resolve and semi-reflection can be achieved by externals resolver in functional style (https://webpack.js.org/configuration/externals/#function), and runtime by load module API (https://webpack.js.org/api/module-variables/#webpack_modules-webpack-specific- )
In learning more about ES6/2015 imports, I've come across a couple of cases where I'd like to change the namespace of the default member in the import scope.
Basically the equivalent of import {myMember as name} from 'my-module', but for the default member. I expected something like import defaultMember, {defaultMember as name} from 'my-module', but that seems not to work.
It seems like this should possible:
Mozilla Docs
It is also possible to use the default syntax with the ones seen above (namespace imports or named imports). In such cases, the default import will have to be declared first...
Perhaps not the actual answer, but a solution that I'm using.
For this example, I was using Node-Simple-Schema, and did not want to track imports of it as it is often used across the global scope on the project I'm working on.
The problem is that when import SimplSchema from "simpl-schema'; is used, then "SimpleSchema" as a convention is not available globally.
So I created a code file "SS2.js" and placed the following in it:
import SimpleSchema from 'simpl-schema';
var SS2 = SimpleSchema;
export {SS2};
Then in the working file, I do a subsequent "chained" import and with the following:
import {SS2} from './imports/SS2.js';
SimpleSchema = SS2;
This gives me the default module export convention "SimpleSchema" available globally once again.