PhpStorm - Laravel Mix Alias Path Resolve Issue.js

// On PhpStorm, when ussing with laravel mix, for Alias path resolving in components you have to: 
// - create a webpack.config.js file separately like: 

const path = require('path')
const webpack = require('webpack')

module.exports = {
  ...
  resolve: {
    extensions: ['.js', '.json', '.vue'],
    alias: {
      '~': path.resolve(__dirname, './resources/assets/js')
    }
  },
  ...
}
  

// And then import it in the webpack.mix.js like: 

  
const config = require('./webpack.config')
...
mix.webpackConfig(config)

  
// Make sure the webpack configuration file is pointed correctly in the configuration of the PhpStorm in: Settings > Languages & Frameworks > Javascript > Webpack

Thanks a great solution.
Can I provide this for my team using the git repository?

Of course man! I'm glad it helped you :)
Come on, spread the word!

cool

Works properly. Thanks!

You're welcome! 😁

Thanks !!

I'm a little confused. I already have a webpack.config.js file that was put in by laravel-mix (don't you?). How do I integrate your code? If I just paste it in, and then import it into webpack.mix.js, nothing works. The existing webpack.config.js looks like this (minus the comments):

require(__dirname + '/node_modules/laravel-mix/src/index');

Mix.paths.setRootPath( path.resolve(__dirname) );

require(Mix.paths.mix());

Mix.dispatch('init', Mix);

let WebpackConfig = require(__dirname + '/node_modules/laravel-mix/src/builder/WebpackConfig');

module.exports = new WebpackConfig().build();

Thanks @nachodd! It worked in PhpStorm 2020.1.

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js,
so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js,
so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

worked for me too, thanks

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js,
so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

Worked!!! thanks so much

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js,
so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

@alessandrofuda Thanks a lot man.
You saved my day.

@alessandrofuda You are the man 🚀

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

@alessandrofuda Omg! Thank a lot

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

good job @alessandrofuda
in 2021.1 version need confirm from Event Log (right side bottom)

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

thank :) 🥇

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

Thank you! 🥳

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

Nice!!!!

Another solution without create a webpack.config.js file separately:

phpstorm search for webpack.config.js, so into: phpstorm | Settings | Languages & Frameworks | Javascript | Webpack

have to set this path: your-project/node_modules/laravel-mix/setup/webpack.config.js

this works for me

Thanks, it worked for me !!!!