javascript - 如何使用 Laravel Mix 连接已编译的 SASS 和组合的 CSS?

标签 javascript css laravel webpack laravel-mix

在我的 Laravel 元素中,我同时使用 SASS 和 CSS:SASS 用于依赖项(fontawesome、Bootstrap)——通过 NPM 和跨深层文件夹结构 (BEM) 的纯 CSS。我想连接所有 CSS,编译 SASS 并将其全部连接到一个 .css 文件中。与 JS 相同:我的 BEM 结构中的纯 JS 文件需要与需要由 Webpack 处理的单个 app.js 文件组合。我试过这个:

mix.js('resources/assets/js/app.js')
    .scripts('resources/assets/blocks/**/*.js')
    .version('public/js/app.js');

mix.sass('resources/assets/sass/app.scss')
    .styles('resources/assets/blocks/**/*.css')
    .version('public/css/app.css');

但它不起作用 - 只创建了 list 文件:

{
  "/js/app.js": "/js/app.js",
  "/css/app.css": "/css/app.css",
  "/mix.js": "/mix.js"
}

最佳答案

这是一个例子:

mix.sass('resources/assets/sass/app.scss', 'public/css').styles([
    'node_modules/animate.css/animate.min.css',
    'public/css/app.css'
],'public/css/app.css');

关于javascript - 如何使用 Laravel Mix 连接已编译的 SASS 和组合的 CSS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45676650/

相关文章:

javascript - angularjs:在 html 输入中只允许整数

html - 你如何居中960px 宽的网站布局?

javascript - 如何使用显示全部/无按钮使其工作?

javascript - 以创建者用户身份单击按钮时运行函数 - Google 电子表格

javascript - 简单的 React Redux 入门包 |发电机

html - "push up"内容上方的背景具有动态高度

php - 如何在 Laravel PHPUnit 测试中获取响应变量?

php - 我如何使用 phpunit 测试这个类?

laravel - 通过外键显示数据

javascript - 无论窗口大小如何,如何让我的 Logo 、幻灯片和图像覆盖整个屏幕