Develop Reference

How to tune babel loader to properly import a module named macro.js when using CRA

I'm using a library vtk.js. VTK has a special design of classes (https://kitware.github.io/vtk-js/docs/develop_class.html). When I write a class I need to import macro.js module which exposes several base methods such as getters/setters/newInstance etc (https://github.com/Kitware/vtk-js/blob/master/Sources/macro.js).
Looks like CRA uses some special loader for macro.js files. I get an error when trying to import such a file (SyntaxError: Cannot use import statement outside a module). If I copy an original file macro.js from #kitware/vtk.js to my local source folder I still get an error. Even if I remove all the contents of macro.js file I get an error (The macro imported from "../macro" must be wrapped in "createMacro" which you can get from "babel-plugin-macros". Please refer to the documentation to see how to do this properly: https://github.com/kentcdodds/babel-plugin-macros/blob/master/other/docs/author.md#writing-a-macro). However, when I rename macro.js to macro2.js the error is gone.
Is there some way how can I disable this macro loader?

eslint parsing error: Cannot read file 'c:\user\repo\ts-project\tsconfig.json' after setup with firebase

My eslint can't find my my tsconfig.json file because it expects it to be at the top level (like listed in the title) but instead its at ts-project/firebase/tsconfig.json. However if I just copy it and place it in the top level it still doesn't work.
How can I tell eslint that the correct path is ts-project/firebase/tsconfig.json instead of ts-project/tsconfig.json

Using require with root path variable in VSCode

I am using global variable __root with path of my root app directory then I am using require to load code from other files.
const Parser = require(__root + '/parsers/Parser')
The issue is that vscode does not understand what is happening:
Intellisense does not work
Object type is shown as any (if path is correct vscode grabs right type)
What are the options to solve this? Can you share your practices to resolve this issue?

VS Code's intellisense cannot understand dynamic import paths like root + '/path'. There are no workarounds for this, nor are the plans to address this in the immediate future.
However, with static require import paths, you can configure how VS Code resolves the imports by configuring a jsconfig.json. The two options you probably want are baseUrl and paths
Setting up a jsconfig.json will not change the runtime behavior of your code, only how VS Code IntelliSense handles your project. You can use a jsconfig.json along with webpack aliases

EmberJs: Not able to resolve config/environment.js from a service

Ember version - ~2.8.0
This might seem really simple, but it has got on to nerves after hours of looking through for a fault.
I am trying to simply import the config/environment.js file into a service(at app/services/myservice.js) and make use of the contents. like this -
import config from "../config/environment";
But, all i get is "Cannot read property 'APP' of undefined" in the console, if i do config.APP. Even though environment.js is present physically, under demo-app/config/environment.js.
i am confused, if i am missing some convention, or some setting somewhere that needs to be present, in order for this to resolve correctly.
Please help.
Also(Although this was obvious), if i change the import as import config from "../../config/environment";, it says Could not find module 'config/environment' imported from 'demo-app/services/myservice'
I do understand the app folder is skipped in the resolution. i.e. the physical address of demo-app/app/something... becomes demo-app/something... . But some one please explain why it may not be resolving. It is in the fresh installation of the App.

import ENV from 'demo-app/config/environment'; works for me (demo-app is a package name and usually it's the same as your project root directory name). A big advantage of this method is that you don't need to think how much ../ you need to put, just drop the same line in any of your files.

I prefer using resolveRegistration of ApplicationInstance such as:
let conf = Ember.getOwner(this).resolveRegistration('config:environment');
Pass your service as this.

This will be the correct relative path in your case,
import config from "./../config/environment";

Require in react can't resolve path

I'm trying to use tracking-js library in my project I'm using react but I dont know if I'm doing anything wrong but keep showing that the module is not found, I already check my package.json and the module install. So this is how I require the module:
const tracking = require("tracking");
what am I doing wrong?

For node, including node-based build tools, first make sure that the module is present. Keep in mind that require does not care about the package.json of your app, only about the module files being present.
Check if node_modules/tracking is present.
Make sure the "main" JS file can be found. If there's a node_modules/tracking/package.json file, see if it has a main property and if the file it references exists. If there is no main property, make sure there's an index.js in the root of the module directory.
If all this is fine and you're getting the module not found error at runtime in client-side JavaScript, then your bundling config may be incorrect, and your webpack/browserify/whatever config will have to be scrutinized for bugs.