首页 > 解决方案 > Bulma 样式覆盖不起作用;使用 Laravel 7.25.0

问题描述

我一直在使用 Bulma 作为我正在使用 Laravel 构建的网站的 CSS 框架,并且由于某种原因,我一直在编写的覆盖实际上都没有发生。事实上,如果我从我的 app.scss 文件中删除所有内容(包括导入 Bulma 的行),则没有任何变化。我尝试遵循为 node-sass 提供的文档,当我尝试执行npm css-build命令时,出现以下错误:

> @ css-build /Users/userName/Sites/siteName
> node-sass --omit-source-map-url sass/app.scss css/app.css

An output directory must be specified when compiling a directory
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ css-build: `node-sass --omit-source-map-url sass/app.scss css/app.css`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ css-build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

我知道这可能是一个措辞糟糕的问题,但如果有人能指出我正确的方向,我将不胜感激。我只是真的迷路了。

应用程序.scss:

@charset "utf-8";
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");

// Variables
@import "_variables";

// Font Awesome
@import "font-awesome/scss/font-awesome";

// Bulma
@import "bulma/bulma";

// Bulma Vue Modules
@import "buefy/src/scss/buefy";

// Other SCSS Files
@import "overrides";
@import "helpers";
@import "manage";
@import "styles";

package.json 的脚本部分:

"scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "css-build": "node-sass --omit-source-map-url sass/app.scss css/app.css",
        "css-watch": "npm run css-build -- --watch",
        "start": "npm run css-watch"
    },

标签: laravelnpmsasslaravel-7bulma

解决方案


推荐阅读