webpack (avec sass-loader) - fichier scss @import ne reconnaît pas résoudre alias

Mon projet structure:

webpack.config.js
app--

   --> src
   ---->> components
   ------>>> myComponent.js
   ------>>> myComponent.scss

   --> styles
   ---->> variables.scss

Dans webpack.config du module.exportations:

...
resolve: {
    alias: {
       styles: path.join(__dirname, 'app/styles') 
   }
}

Dans mon fichier - moncomposant.scss:

@import "styles/variables";

J'obtiens cette erreur lors de la construction de bundle.js:

Module build failed:
@import "styles/variables";
^
      File to import not found or unreadable: styles/variables

Comment puis-je @import alias dans les fichiers sass?

  • Peut-être l'ajout d'informations sur la structure du répertoire du projet, en particulier les fichiers mentionné, pourrait l'aider.
  • ajout de la structure de projet à la question
  • Un moyen très rapide de l'observation peut être sans importance: le répertoire styles est inclus à la fois dans alias.styles comme path.join(..., 'app/styles') et à l'importation comme @import "styles/variables". Il faudra peut-être @import "variables".
  • C'est de cette façon qu'un alias est défini et utilisé dans le webpack - webpack.github.io/docs/configuration.html#résoudre-alias
  • Avez-vous trouvé une solution?
  • nope, toujours pas de solution. actuellement je viens d'utiliser le chemin relatif dans le sass fichier d'importation, sans se référer à l'alias..

InformationsquelleAutor tome | 2016-01-11