如何在 mix.copy 使用 Laravel-Mix 完全执行后触发 sass 构建

Question

我在我的应用程序中实现了 Laravel-Mix，并将文件从 node_module 复制到我的资产文件夹，然后编译我的 scss。由于复制过程很慢，我的 scss 无法找到依赖库。有没有办法延迟 sass 构建并在复制任务完成后触发它？

这是我的 webpack

 let mix = require('laravel-mix');    
 mix.copy('node_modules/ionicons', 'resources/assets/css/libs/ionicons')
 mix.sass('resources/assets/css/sass/app.scss', 'public/dist');

下面是我的app.scss

@import '../libs/ionicons/dist/css/ionicons';
@import 'header';

这是我遇到的错误

95% emitting ERROR  Failed to compile with 2 errors7:38:04 PM

 error  in ./resources/assets/css/sass/app.scss

Module build failed:
@import '../libs/ionicons/dist/css/ionicons';
^
      File to import not found or unreadable: ../libs/ionicons/dist/css/ionicons.

Answer 1

使用 tilda 导入器。
Webpack 将 ~ 识别为 projectRoot/node_modules

app.scss

@import '~ionicons/dist/css/ionicons.css';
@import 'header';

或更好地导入 sass 版本，使其更加灵活。

app.scss

$ionicons-font-path: '~/ionicons/dist/fonts'; //change path to ionicon font

@import '~ionicons/dist/scss/ionicons';
@import 'header';

webpack.mix.js

 let mix = require('laravel-mix');
 mix.sass('resources/assets/css/sass/app.scss', 'public/dist');

如何在 mix.copy 使用 Laravel-Mix 完全执行后触发 sass 构建

How to trigger sass build after mix.copy is completely executed using Laravel-Mix

laravel

webpack

laravel-5

laravel-mix