Question

对于一个小项目，我有一个非常简单的文件，实际上是对CSS进行了2次更改，而这只是扩展。

// Settings
@import "settings";

// Foundation
@import "../../node_modules/foundation-sites/scss/foundation";

#change-approval-wrap {
  @include foundation-typography;
  @include foundation-global-styles;
  @include foundation-forms;
  @include foundation-xy-grid-classes;
  @include foundation-button;
  @include foundation-accordion;
  @include foundation-table;
  @include foundation-tabs;

  .ca-button {
    @extend .button
  }

  .ca-table {
    @extend table
  }
}

每当我运行build（dev或prod）时，我都会得到以下信息：

WARNING in ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/lib??postcss!./node_modules/resolve-url-loader??ref--5-4!./node_modules/sass-loader/lib/loader.js??ref--5-5!./admin/css/app.scss
(Emitted value instead of an instance of Error)   resolve-url-loader cannot operate: CSS error
  /Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/admin/css/app.scss:561:27: property missing ':'
  at error (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/css/lib/parse/index.js:62:15)
 @ ./admin/css/app.scss 4:14-254
 @ multi ./admin/js/app.js ./admin/css/app.scss

但是，当我观看跑步时，我会得到

/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack-notifier/index.js:42
    if (error.module && error.module.rawRequest)
              ^

TypeError: Cannot read property 'module' of undefined

    at module.exports.WebpackNotifierPlugin.compileMessage (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack-notifier/index.js:42:15)
    at module.exports.WebpackNotifierPlugin.compilationDone (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack-notifier/index.js:57:20)
    at Compiler.applyPlugins (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/tapable/lib/Tapable.js:61:14)
    at Watching._done (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:105:17)
    at compiler.emitRecords.err (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:79:19)
    at Compiler.emitRecords (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:371:38)
    at compiler.emitAssets.err (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:62:20)
    at applyPluginsAsyncSeries1.err (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:364:12)
    at next (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/tapable/lib/Tapable.js:218:11)
    at Compiler.compiler.plugin (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
    at Compiler.applyPluginsAsyncSeries1 (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/tapable/lib/Tapable.js:222:13)
    at Compiler.afterEmit (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:361:9)
    at require.forEach.err (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/webpack/lib/Compiler.js:350:15)
    at /Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/async/dist/async.js:473:16
    at iteratorCallback (/Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/async/dist/async.js:1064:13)
    at /Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/async/dist/async.js:969:16
    at /Users/user/IdeaProjects/folder/public_html/wp-content/plugins/change-approval/node_modules/graceful-fs/graceful-fs.js:43:10
    at FSReqWrap.oncomplete (fs.js:135:15)

我注意到当我移入@include foundation-typography;并且@include foundation-typography;在我创建的命名空间之外时，这种情况开始发生。与@include foundation-typography;本身包含的内容有什么关系？

另外，即使它给出了错误/警告，我仍然可以得到我想要的一切的CSS输出，但是如果它正在运行，观察会失败并关闭，并且我将@include foundation-typography;添加到名称空间。

嵌套的SCSS无法编译但仍然发出CSS

0 个答案: