As soon as I added the `~` prefix to import path and specified a path to webpack configuration file in Settings | Languages & Frameworks | JavaScript | Webpack (path/to/webstorm-vue-scss-import-wrong-h/node_modules/@vue/cli-service/webpack.config.js), it starts working for me:
Elena Pogorelova path/to/webpack.config.js does not work for me :(
Can't analyse webpack.config.js: coding assistance will ignore module resolution rules in this file. Possible reasons: this file is not a valid webpack configuration file or its format is not currently supported by the IDE. Error details: Cannot read property 'require' of undefined
Please try prefixing the import path with
~:See https://webpack.js.org/loaders/sass-loader/#imports, https://stackoverflow.com/questions/34717203/webpack-with-sass-loader-scss-file-import-does-not-recognize-resolve-alias
@Elena Pogorelova Thank you my partner it has fixed it ;
Didn't fix for me. Webstorm 2019.2
Any solutions?
@import "~@/styles/mixins.scss" should work; please share a project the issue can be reproduced with
https://github.com/FrankFang/webstorm-vue-scss-import-wrong-h/blob/master/src/views/Home.vue
Elena Pogorelova I uploaded a demo project which reproduces the wrong hints. The code runs well.
As soon as I added the `~` prefix to import path and specified a path to webpack configuration file in Settings | Languages & Frameworks | JavaScript | Webpack (path/to/webstorm-vue-scss-import-wrong-h/node_modules/@vue/cli-service/webpack.config.js), it starts working for me:
Elena Pogorelova path/to/webpack.config.js does not work for me :(
Can't analyse webpack.config.js: coding assistance will ignore module resolution rules in this file.
Possible reasons: this file is not a valid webpack configuration file or its format is not currently supported by the IDE.
Error details: Cannot read property 'require' of undefined
btw @vue/cli-service version is 4.1.0-beta.0
it works fine for me using your project
please share your idea.log (upload it to some file server and provide a link)
Elena Pogorelova I find out the reason.
https://github.com/JetBrains/svg-sprite-loader/blob/85f07caed508403ab259b5b13eabc97704e0261b/lib/utils/get-webpack-version.js#L2
I use svg-sprite-loader in my project, it causes the problem.
It works fine after I modify the source code of svg-sprite-loader
Then
Module resolution rules from webpack.config.js are now used for coding assistance.
That's it.
But I wonder why require.main is undefined when WebStorm tries to parse webpack.config.js.
https://github.com/JetBrains/svg-sprite-loader/issues/351
known issue, please follow https://youtrack.jetbrains.com/issue/WEB-38978 for updates