how to import external .js file in webpack with react? - node.js

Here is a file named tableau.js without npm package. I want to use it in my project? However, I cann't solve this problem. Please help me and show me correct ways. Thanks!

You need to use export module to export variables and functions from a file to another. Import your stuff to your main file. See https://www.sitepoint.com/understanding-module-exports-exports-node-js/
You could also use http://www.tutorialsteacher.com/nodejs/nodejs-module-exports

Related

styled-system Custom Breakpoints

I would like to specify my own custom breakpints. The documentation as https://styled-system.com/responsive-styles/#using-objects only refers to theme.js.
But I don't understand where do I place theme.js? or find it? and how do I import it into the project? and how do I define breakpoints with aliases and use plain objects as values.?
Can someone please guide me? I am using styled-system in Gatsby.js
You simply need to export a key called breakpoints. In my project we use a js file to define our theme, it looks like this
export const breakpoints = ['769px', '1367px'];
Since you are using Gatbsy, you need to install gatsby-plugin-theme-ui. Your theme file will be src/gatsby-plugin-theme-ui/index.js.

How to import libraries from another (local) directory?

Why I mean with that title is:
I have some generated code which I am using in my Angular application.
Currently, I am installing this as a package using npm, but this makes problem with my whole deployment setup.
Therefore I'd like to move this code to something like src/vendor/my-generated-library.
I can do that but all my imports then would look something like
import {MyObject} from '../../../../vendor/my-generated-library';
Is there a way to define src/vendor as some sort of additional library-root, such as node_modules, such that all my imports can stay as they currently are?
import {MyObject} from 'my-generated-library';
You could simply modify your package.json to have this library as dependency and point the path as your src's directory. something like
"my-generated-library": "./somepath/vendor/my-generated-library"
Hope this helps

How do you add a typescript namespace from a node module to the global namespace?

I know that this is not best practice but I dont have a choice. The project I am working on has had its own moment typings file for a long time and it is now causing issues. Moment now provides its own typing file which I want to use, but I need to keep it global. How do I do this please?
I have tried just editing our moment.d.ts file inline with suggestions here
[TypeScript: How can I make an existing namespace global? which didnt work with an error of 'moment refers to a UMD global, but the current file is a module'.
I have also tried editing the typescript config file to simply 'include' the the node module d.ts file but this gave me a no inputs were found in config file error.
Solved this by creating a new global custom typing and a global value cosponsoring which is a separate moment instance. Super hacky and very temporary but works for now...

NPM Package doesn't have Types

I'm transforming a small express api to use TypeScript, but some of the packages don't have a #types/ so when I import them I get a TS2307 error.
Is there something I can do to resolve the error? Or maybe type it myself, depending on the package complexity. One example is express-bearer-token(found here)
The quick way is to create a globals.d.ts file and add the line:
declare module "express-bearer-token";
This will treat express-bearer-token as a JS module without typings. More information about that here.
From there, you can start adding more typings yourself if you wish. You can find some information about writing your own definitions here.
For daisyui
Create global.d.ts in the root directory
Add the below line
declare module "daisyui";
Note: Stop the server and re-start if you the server is running already.

Import a javascript module as dynamic using typescript

I want to import a normal javascript module (e.g. vhost) into my node.js typescript file using CommonJS.
I can do this with the following line:
import vhost = require('vhost')
We assume that I can't find a .d.ts file on the internet, but I also don't want to write it by myself, so I just use the vhost variable without intellisense.
The compiler complains and complains:
How can I tell that I just want it to be 'dynamic' (like the C# dynamic keyword or 'var' in normal javascript) and use all of the things in the picture above?
I could create a vhost.d.ts file, but I don't know what to write in there:
declare module 'vash' {
// what to write here?
}
I found this out while typing the question, it was so easy that it is almost embarrassing, but maybe somebody has this problem too.
Just use var instead of import:

Resources