CODEWITHSUNDEEP
webpacksassvue.jsvue-component
Arc
Arc

Reputation: 11

File to import not found

So I'm trying to import my SCSS file with all vars and mixins definitions to all components I have. File name for defs is _defs.scss:

<style lang="scss">
@import "styles/defs";

some component styling
</style>

I also used alias in webpack to define where to look for styles folder:

resolve: {
  alias: {
    'vue$': 'vue/dist/vue.esm.js',
    assets: path.resolve(__dirname, "src/assets/"),
    styles: path.resolve(__dirname, "src/styles/")
  }
}

But for some reason webpack still throws error telling he can't find the import file.
Where am I wrong?

Project Structure

Project Structure

Upvotes: 0

Views: 282

Answers (2)

Arc
Arc

Reputation: 11

Changing 

@import "styles/defs";

to

@import "~styles/defs";

will solve the problem. See: explanation.

Upvotes: 1

teju c
teju c

Reputation: 336

I haven't use webpack in months, but can you check this:

https://webpack.github.io/docs/resolving.html, http://moduscreate.com/es6-es2015-import-no-relative-path-webpack/

Upvotes: 0

Related Questions