Nuxt (2.10)/Typescript (3.6)
In the latest version of WebStorm (2019.2.3), we encountered an issue with path aliases not working properly, leading us to create a workaround by setting up a fake webpack.config.js file:
const path = require('path')
module.exports = {
resolve: {
// configuring for WebStorm
alias: {
'@': path.resolve(__dirname),
assets: path.resolve(__dirname, './assets')
}
}
}
This solution allowed us to use path aliases in .vue files:
<style lang="scss" scoped>
.test {
background: url('~assets/svg/ios.png');
}
</style>
While this method works in webpack, issues have been reported in WebStorm:
https://i.sstatic.net/Googw.png
We are now exploring options to implement webpack aliases within styles or even directly in .scss files. Is there a way to achieve this?