如何让 Gatsby + netlify 网站在我的机器上运行?

How do I make Gatsby + netlify website work on my machine?

我部署了一个带有 netlify + gatsby 默认选项的应用程序,然后我克隆了那个 repo,所以我可以编辑样式。问题是它在我的机器上不起作用,仍然存在以下错误:

    2 problems (0 errors, 2 warnings)


ERROR #98123  WEBPACK

Generating development JavaScript bundle failed


$black: #2b2523;
               ^
      Invalid CSS after "...black: #2b2523;": expected 1 selector or at-rule,
was ".navbar .navbar-men"
      in /Users/micazev/Documents/ecominimalismo.com/src/components/all.sass
(line 11, column 17)

File: src/components/all.sass

failed Building development bundle - 22.833s
 ERROR  Failed to compile with 1 errors                                 14:39:49
⠀
 error  in ./src/components/all.sass
⠀
Module build failed (from
./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from
./node_modules/sass-loader/dist/cjs.js):

$black: #2b2523;
               ^
      Invalid CSS after "...black: #2b2523;": expected 1 selector or at-rule,
was ".navbar .navbar-men"
      in /Users/micazev/Documents/ecominimalismo.com/src/components/all.sass
(line 11, column 17)
    at /Users/micazev/Documents/ecominimalismo.com/node_modules/webpack/lib/Norm
alModule.js:316:20
    at /Users/micazev/Documents/ecominimalismo.com/node_modules/loader-runner/li
b/LoaderRunner.js:367:11
    at /Users/micazev/Documents/ecominimalismo.com/node_modules/loader-runner/li
b/LoaderRunner.js:233:18
    at context.callback (/Users/micazev/Documents/ecominimalismo.com/node_module
s/loader-runner/lib/LoaderRunner.js:111:13)
    at Object.callback (/Users/micazev/Documents/ecominimalismo.com/node_modules
/sass-loader/dist/index.js:89:7)
    at Object.done [as callback] (/Users/micazev/Documents/ecominimalismo.com/no
de_modules/neo-async/async.js:8069:18)
    at options.error (/Users/micazev/Documents/ecominimalismo.com/node_modules/n
ode-sass/lib/index.js:294:32)

 @ ./src/components/Layout.js 17:0-20
 @ ./src/templates/blog-post.js
 @ ./src/cms/preview-templates/BlogPostPreview.js
 @ ./src/cms/cms.js
 @ multi ./node_modules/gatsby-plugin-netlify-cms/cms.js
./node_modules/gatsby-plugin-netlify-cms/cms-identity.js ./src/cms/cms.js

我的回购是:https://github.com/micazev/ecominimalismo.com

我不知道我还能提供什么其他信息。请帮忙

根据一些关于该启动器的线程,Sass 加载器存在一个错误导致了这个问题。您在此 GitHub thread:

中提供了许多解决方案
  • 添加选项到gatsby-plugin-sass:

    {
      resolve: 'gatsby-plugin-sass',
      options: {
          indentedSyntax: true
        }
    }
    

    这将允许加载程序理解 Sass 的缩进语法。

  • 将扩展名从 .sass 更改为 .scss,同时更改项目中的所有引用:您需要添加分号 (;) 和需要时大括号 ({})。

显然,第二种更容易也更安全。