Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Bug with custom alias in Webpack

See original GitHub issue

Version of used depedencies:

"webpack": "^3.5.6",
"eslint": "^4.3.0",
"eslint-config-airbnb": "^15.1.0",
"eslint-config-airbnb-base": "^11.3.1",
"eslint-config-prettier": "^2.9.0",
"eslint-import-resolver-webpack": "^0.8.4",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-prettier": "^2.3.1",
"eslint-plugin-react": "^7.5.1",

Configuration of resolving alias: webpack.config.js

resolve: {
    extensions: [".js", ".jsx"],
    alias: {
      myCustomAlias: path.resolve("src"),
    },
 },

Configuration of .eslint.js:

  settings: {
    "import/resolver": {
      webpack: {
        config: path.resolve("webpack/webpack.config.js"),
      },
    },
  },

Description of issue: As you can see I have defined custom alias in webpack and when I am running eslint from the CLI everything passes but somehow VS plugin cannot resolve aliases and highlights every line when I am trying to import things from myCustomAlias

Any idea what may causing that behavior?

Issue Analytics

State:
Created 6 years ago
Reactions:6
Comments:24 (8 by maintainers)

Top GitHub Comments

2reactions

vscodebot[bot]commented, Apr 10, 2018

This issue has been closed automatically because it needs more information and has not had recent activity. See also our issue reporting guidelines.

Happy Coding!

2reactions

pdomalecznycommented, Mar 6, 2018

@willisplummer @dbaeumer Sorry for a little absence. I had some business trips. I have resolve in webpack.config.js and my eslint settings are pointing to it. I have no errors when I run eslint from CLI but in VS Code everything is highlighted so I guess it isn’t a solution for me :C

Top Results From Across the Web

Resolve | webpack

resolve.alias. object. Create aliases to import or require certain modules more easily. For example, to alias a bunch of commonly used src/ folders:....

Webpack loader aliases? - Stack Overflow

The resolveLoader.alias might work in the given case, since you are using a plugin as the loader. However if you need to use...

Invalid webpack resolve alias - Next.js

This is not a bug in Next.js, it's related to the user adding a custom webpack(config) config to next.config.js and overriding internals by...

Make VSCode works with your custom Webpack aliases

Problem: The ESLint config use "webpack" for "import/resolver", but my VSCode cannot detect it. In this case, the aliases are @app and ...

How to Create a Path Alias in Webpack - Bitovi

Establish the Module Aliases · Open your Webpack.config.js file. · If it's not already there, add a resolve property to the configuration object ......