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

Question

我使用 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

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

Answer 1

根据有关该启动器的一些线程，Sass 加载程序存在一个导致此问题的错误。这个GitHub thread提供了很多解决方案：

• 给gatsby-plugin-sass添加选项：

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

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

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

显然，第二个更简单、更安全。