Question

我在电子应用程序中使用materialize-css（0.100-2）的npm模块。不在git中跟踪Npm模块。我更改了SASS组件，特别是这些文件：

node_modules/
+-- materialize-css/
    +-- sass/
        materialize.scss    <-- changes
        +-- components/
            ...
            _color.scss     <-- changes
            _variables.scss <-- changes
            _palette.css    <-- new file I added

我已使用此处的说明materialize.css在node_modules/materialize-css/dist/css中编译了新的PowerShell.ps1 $ScriptDir = Split-Path $script:MyInvocation.MyCommand.Path & $ScriptDir\Test\bin\debug\Test.exe /createpackage$$$ScriptDir$$$ScriptDir Test.exe var cpc = args.FirstOrDefault(a => a.StartsWith("/CREATEPACKAGE", StringComparison.InvariantCultureIgnoreCase)); if (cpc != null) { var options = cpc.Split(new string[] { "$$" }, StringSplitOptions.RemoveEmptyEntries); if (options.Length < 3) { _Logger.Error("Missing required <path> and <output dir> parameters."); PrintUsage(); Environment.Exit((int)ExitCode.Failure); }，并且一切正常。

但是，我打算升级到1.0.0-beta，需要在git中保留我的修改。关于如何将我的修改与SASS文件分开但在编译CSS时仍包含它们的任何想法或最佳实践？

Answer 1

您不应直接更改node_modules文件，而应在项目根目录中定义另一个文件，例如：app.scss

/
  ...
  node_modules/
  ...
  app.css
  package.json

如右图所示：http://materializecss.com/sass.html，您现在可以在app.scss文件中更改您的托盘：

// Import materialize-css
@import "~materialize-css/sass/materialize";

$primary-color: color("materialize-red", "lighten-2") !default;
$primary-color-light: false !default;
$primary-color-dark: false !default;
@if not $primary-color-light {
  $primary-color-light: lighten($primary-color, 15%);
}
@if not $primary-color-dark {
  $primary-color-dark: darken($primary-color, 15%);
}
$secondary-color: color("teal", "lighten-1") !default;
$success-color: color("green", "base") !default;
$error-color: color("red", "base") !default;

$link-color: color("light-blue", "darken-1") !default;

/*** More variables not shown here.. ***/

注意您需要添加sass编译器。

实现CSS - 如何将颜色修改与NPM模块分开？

1 个答案: