Laravel mélange ne pouvait pas compiler un fichier SCSS contenant l'importation

Question

boussole/CSS3 J'ai un fichier nommé main.scs qui a importé un fichier general.scss qui a la première ligne ceci:

@import "compass/css3"; 

Comme vous pouvez le voir, j'importé compass/css3 à utiliser des mixins prédéfinis.

Bien sûr, tous sont dans un projet larvel. larvel a une bibliothèque Mix intégrée pour compiler des fichiers scss et d'autres types.

J'ai également écrit ce à webpack.mix.js fichier:

let mix = require('laravel-mix'); 

mix.sass('resources/assets/sass/main.scss', 'public/main/css'); 

Mais lors de l'exécution npm run production commande j'ai eu cette erreur:

error in ./resources/assets/sass/main.scss 

Module build failed: 
@import "compass/css3"; 
^ 
     File to import not found or unreadable: compass/css3. 
Parent style sheet: D:/wamp/www/loverspay/resources/assets/sass/_general.scss 
     in D:\wamp\www\loverspay\resources\assets\sass\_general.scss (line 1, column 1) 

Même j'installé boussole dans le répertoire du projet mais il y a encore ce problème

Que dois-je faire?

Answer 1

Si vous avez la bibliothèque de la boussole installée à l'intérieur node_modules répertoire que vous pouvez essayer de l'importer comme ceci:

@import "~compass/css3"; 

Si cela ne permet pas que vous pouvez essayer de modifier la variable de configuration SASS includePaths (mix Laravel a un troisième option pour passer config supplémentaire):

mix.sass('resources/assets/sass/main.scss', 'public/main/css', { 
    includePaths: [path.resolve(__dirname, './relative/path/to/compass')] 
});