Develop Reference

Not able to absolute import in React Native project using babel-plugin-module-resolver

The file structure of my project is:
|--node_modules
|--src
|--App.js
|--Splash.js
I want to import Splash.js in App.js using absolute import.
So, I added babel-plugin-module-resolver and set up a babel.config.js with the following contents (followed How to enable jsconfig.json in react-native project):
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
["module-resolver", {
"root": ["./"]
}]
]
};
and App.js
import Splash from 'Splash.js';
Error in my console:
error: Error: Unable to resolve module Splash.js from C:\Users\<userName>\Desktop\<AppName>\App.js: Splash.js could not be found within the project or in these directories:
node_modules
Can anyone explain what is actually happening? How does baseUrl actually work? I am using it in a wrong way?

How to use module `module` in a vue project?

ERROR Failed to compile with 6 errors 16:20:36
This dependency was not found:
* module in ./node_modules/#eslint/eslintrc/lib/shared/relative-module-resolver.js, ./node_modules/eslint-plugin-vue/lib/rules/experimental-script-setup-vars.js and 4 others
I want to use eslint and eslint-plugin-vue directly in my vue project, but I got the above error after run serve.
How to polyfill module or how to resolve it? Thank you all.
Project:
use vue.config.js

We can resolve the problem by this way:
https://github.com/ota-meshi/eslint-plugin-vue-demo
The link page refer us a demo to use eslint and eslint-plugin-vue in browser.
Configs in vue.config.js of project can resolve the above question:
resolve: {
alias: {
// resolve `module` not found
module: path.resolve("./shim/module.js"),
globby: path.resolve("./shim/empty"),
eslint$: path.resolve("./shim/eslint/index.js"),
esquery: path.resolve("./node_modules/esquery/dist/esquery.min.js"),
"#eslint/eslintrc/universal": path.resolve(
"./node_modules/#eslint/eslintrc/dist/eslintrc-universal.cjs",
),
}
},
alias links to this directory:
https://github.com/ota-meshi/eslint-plugin-vue-demo/tree/main/shim
Other alias will resolve faults after resolve module not found happen.

Absolute path doesn't work, "Can't resolve"

So i tried to set up an absolute path for my project so I found out I need to make a .env file with following command:
NODE_PATH=src
Then I modified my import paths from './FileName' to 'FileName' ex.
import Root from 'views/Root/Root';
and run npm start command, then I got an error in terminal:
Failed to compile.
./src/index.js
Module not found: Can't resolve 'views/Root/Root' in 'C:\Users\hisza\Desktop\unnamed\src'
When I change to relative path, everything works with no errors, any ideas why I get that error?
I use create-react-app with eslint, nothing more

Okay I made it using jsconfig.json file instead of .env and everything works
jsconfig.js file is in my main folder and contains:
{
"compilerOptions": {
"baseUrl": "src"
},
"include": ["src"]
}

How do I resolve modules that get processed by exports-loader in webpack?

I'm using webpack 2.1.0-beta.20 and am getting a Module not found: Error: Can't resolve error when trying to build.
I have a file EmsWorkerProxy.js that does not export a module, so I'm using exports-loader so that I can require() it in my script.
On top of that, I also want to turn that into a web worker, so I'm chaining worker-loader to that.
I'd love to not use relative or absolute paths. The scripts are in a vendor directory, so I'm trying to add this to my webpack.conf.js:
resolve: {
modules: [
'node_modules',
'src',
'vendor'
]
},
Unfortunately, it seems like webpack still can't resolve anything.
The line in my app that does
const EmsWorkerProxy = require('worker!exports?EmsWorkerProxy!EmsWorkerProxy'); causes:
Module not found: Error: Can't resolve 'EmsWorkerProxy'
Am I not using webpack correctly?

WebStorm settings for local modules import/require

Is it possible to configure where WebStorm is looking for modules without adding the project itself as a library in the settings?
I have added the following part to webpack and compiling works fine, but I also need code completion
resolve: {
root: [
path.resolve('./asset/js')
]
},
Now I can change something like this:
import { ViewContainer } from './../../application';
to:
import { ViewContainer } from 'application';
But with this I have no code completion and adding /asset/js to the Library seems not to work. It also disables checking for errors on this directory.
WebStorm gives me the warning that no module 'application' is found in package.json
package.json only accept npm modules or git repositories
Do you have any solutions for this problem?

Right click on the directory and go to 'Mark Directory as' and select 'Resource Root'