1

我正在尝试<style>使用 Webpack 对 VueJS 单文件组件的标签中的 SCSS 样式进行 lint。我试图在我的 Webpack 构建的 vue-loader 任务中将webpack 加载器scsslint-loader称为 preLoader。

单文件 vue.js 组件....

<template lang="pug">
  ...
</template>

<script>
  ...
</script>

<style lang='scss'>

   @import '/scss/core/colors';

  .email {
    color: $primary_color;
    width: 320px;
  }

</style>

在 Webpack(2.5) 中，vue-loader 配置看起来像......

module: {
  rules: [
    { test: /\.vue$/,
      loader: 'vue-loader',
      options: {
        preLoaders: {
          'scss': 'scsslint-loader',
          'sass': 'scsslint-loader'
        },
        loaders: {
          'scss': 'vue-style-loader!css-loader!sass-loader',
          'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
        },
      }
    }
  ]
},

运行 Webpack 的结果...

undefined:1
No such file or directory @ rb_sysopen - ;
^

SyntaxError: Unexpected token N in JSON at position 0
    at JSON.parse (<anonymous>)
    at linterResults (C:\wamp\www\spreadless\node_modules\scsslint-loader\dist\scsslint-loader.js:20:28)
    at C:\wamp\www\spreadless\node_modules\scsslint-loader\dist\scsslint-loader.js:57:13
    at ChildProcess.exithandler (child_process.js:277:5)
    at emitTwo (events.js:125:13)
    at ChildProcess.emit (events.js:213:7)
    at maybeClose (internal/child_process.js:897:16)
    at Socket.stream.socket.on (internal/child_process.js:340:11)
    at emitOne (events.js:115:13)
    at Socket.emit (events.js:210:7)
    at Pipe._handle.close [as _onclose] (net.js:549:12)

问题是...

  • 我是否在 Webpack 配置中正确地将 scsslint-loader 作为 vue-loader{preLoader} 调用？
  • 如果是这样，对导致无文件错误的原因有任何想法
4

0 回答 0