I'm looking for a RequireJS plugin that supports loading Typescript 1.0 code.
I found https://github.com/iammerrick/require-ts, but it seems to only work with an older version of Typescript and has not been updated in a long time.
Please don't. Run JS in the browser. Reason:
import dep = require('./something');
is easier + more typesafe than:
define(['ts!./something'], function(dep) {
// dep is compiled to JS at this point.
});
Perhaps you are unaware of TypeScript external modules.
Related
I have been absent from nodejs development for a few years, and to my surprise when I did
$ npm install lodash
the size of my node_modules grew by 4.8MiB
how come a library that judging by its source line count should be around 260KiB takes so much space?
I am deploying my code as an AWS Lambda, and the ability to edit and debug in the console is lost due the increased size of my distribution file (partly because of this).
What's the 2019 way to deal with this?
You node_modules size is irrelevant.
If you build you application the size is much much smaller:
minified 69.2kb
minified + gzipped 24.3kB
see here
If you're using Webpack, ESBuild, or a similar bundler with tree-shaking capabilities, you can import lodash functions discretely.
import foo from 'lodash/foo';
Support for this syntax was added in Lodash v4.
Note the syntax should be 'lodash/foo'. Contrarily, import { foo } from 'lodash' will not be tree-shaken.
Like Norbert said, your node_modules size is irrelevant. You'll want to look at the size of your bundle after building your application. In the case of Webpack, you can use Webpack Bundle Analyzer to gain additional insights into your bundle's distribution. For Vite and other toolchains that use Rollup, consider rollup-plugin-visualizer.
Here's a few more tips:
As of lodash v4, tree-shaking works without additional configuration in Webpack >= v4 and ESBuild. If you use lodash-es and you have other dependencies that require lodash, both will end up in your bundle.
If you're using Babel, and you don't want to refactor your entire codebase to use the aforementioned lodash/foo syntax, consider using babel-plugin-lodash. This plugin rewrites lodash import statements to use the tree-shaking syntax for you.
If you're using Babel's preset-env plugin, set the modules option to false. Babel rewrites modules to use CommonJS by default, which won’t tree-shake.
If you're only using a single Lodash function, you can install it as a standalone module in lieu of installing the entire lodash package. e.g. npm install --save lodash.functionName
lodash-es introduces a few exceptions to this strategy. Refer to this answer for more insight into this.
I am trying to convert Express.js project to binary, and I am using zeit/pkg libary. However, it gave me an error every time I try to use pkg.
Is there a way that I can force Node/Npm to use es5 instead of es6.
in your snapshot the module is being imported from ..er/node_modules/safefs/es6/lib/safefs.js
notice it is importing from es6 which has export keyword. that means its an es6 module and your node supports 'commonjs' require.
which is why this require may be failing.
you can download latest version of node where you can resolve es6 modules.
I am trying to use CommonJS module format, with create-react-app (CRA). The documentation for CRA says:
..Create React App can consume both CommonJS and ES modules. For Node.js
compatibility, it is recommended that the main entry point is CommonJS...
I am finding that when I import a module that offers ES6 module format (via is "module" property in "package.json"), then CRA uses this as the entry point for the module.
Thus - even when my project is using CJS entirely, it then tries to import ES6 modules - and fails.
So - Is this a bug? Or, am I misunderstanding the intended behaviour of create-react-app?
Reproducing
I have reproduced this here: https://github.com/mjashanks/cra-test. This project is a basic CRA skeleton, modified to used CJS.
Additionally, I have added a "test-module", whose a package.json includes a "main" (CJS) and "module" (ES6) entry point.
If we run npm start, the project fails to build, as the file "test-module/index.esm.js" is being used. (We can edit this file to use CJS format to make the project build and make this more clear).
"test-module/index.cjs.js" is never used.
Thanks :)
I found that this actually turned out to be an issue (actually expected behaviour) with Webpack: https://github.com/webpack/webpack/issues/5756
I think i'm missing something with the typescript 2 type system when used with nodejs.
Here is the situation:
Compiling a small nodejs express server written in typescript to plain es5 in order to be run under node 6.10.0 (target: es5 in tsconfig.json).
In my package.json, i installed #types/node (7.0.3) to get node's type informations.
When installing my project using npm (v3.10.10) and then compiling it with typescript (v2.1.5) i get a bunch or errors related to 'Iterable' and 'Iterator' symbol, (which are es6 symbols).
So from what i understand, #types/node use es6 types out of the box, assuming they are already availables.
In order to have the es6 types (Iterator, Iterable and so on) it seams that there is two solutions:
Add the core-js package.
Target es6 instead of es5 in tsconfig.json which will force typescript to use it's lib/lib.es2015..d.ts* definitions files.
In my opinion, the second approach is better.
Is this the official way to go when compiling ts to node ?
ie: targeting es6 in tsconfig ?
How can i be sure that the underlying node engine will effectively support those es6 features ? What if i'm using an old nodejs version without es6 support ?
I'd be glad to discuss to clearly understand the underlying mechanisms !
Thank you
Since node doesn't support completely all es6 features yet see : node green,
it's better to target es5 and install core-js types :
npm install #types/core-js
Problem
I have a reasonable amount of experience using Babel in my projects, but I've come across a situation which I am not sure about:
I have an es5 project, which has a dependency of an es7 node module (a deployment tool).
I want the es5 project to use the es7 module without "polluting" the es5 project with Babel infrastructure.
If my deployment tool module only used es6, I could include the es6 polyfill.
But as there is not es7 polyfill it looks like i should be using [plugins] (https://www.npmjs.com/package/babel-plugin-array-includes).
EDIT #1: As an analogy: If I was using coffeescript, I'd just transpile and save the output in my-coffee-module/dist/index.min.js. How could I do the same with Babel?
I'd perfer to not use the CLI, or another tool (like rollupjs - which is good, but it seems unnecessary).
Previous work
When I put a .babelrc in my module (or use the require hook):
require("babel-core").transform("code", {
presets: ['babel-preset-es2015'],
plugins: ["array-includes"]
});
and then use it from my es5 project I get:
ReferenceError: Unknown plugin "babel-array-includes" specified in "base" at 0
If I use the API (via gulp-babel) I get:
TypeError: undefined is not a function
at exports.default (/Users/me/deploy-tool/node_modules/babel-plugin-array-includes/lib/index.js:11:10)
which is a complaint about Plugin being undefined in the plugin :
/*
... babel-plugin-array-includes/lib/index.js: lines 11-13
*/
return new Plugin("array-includes", {
metadata: {
group: "builtin-post"
},
Any advice or opinion would be appreciated, thanks
EDIT #2: Partial solution: It seems it is not possible without using the Babel CLI at this time, which I will do with npm build scripts.
I'll leave this question open, pending my github issue.