Ошибка vue-loader/less-loader при импорте с помощью TypeError: этот [node.type] не является функцией

Question

Я пытаюсь импортировать внешний файл.css внутри однофайлового компонента Vue, используя less-loader. Без @import Заявление, веб-пакет работает без ошибок. Когда я включаю @import строка, это ошибки с:

TypeError: this[node.type] is not a function
    at Stringifier.stringify (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/stringifier.js:33:24)
    at Stringifier.body (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/stringifier.js:96:18)
    at Stringifier.root (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/stringifier.js:37:14)
    at Stringifier.stringify (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/stringifier.js:33:24)
    at MapGenerator.stringify (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/stringify.js:14:9)
    at MapGenerator.generate (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/map-generator.js:311:
18)
    at LazyResult.stringify (/home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/lazy-result.js:290:24)
    at /home/ctamayo/workspace/docker/tourusa/local/modules/TourUsa/templates/backOffice/default/node_modules/vue-loader/node_modules/postcss/lib/lazy-result.js:227:27
Hash: f8f131fa6a420e70a118
Version: webpack 3.6.0
Time: 1777ms
          Asset     Size  Chunks                    Chunk Names
availability.js  1.47 MB       0  [emitted]  [big]  availability
   [3] (webpack)/buildin/global.js 509 bytes {0} [built]
  [86] ./assets/src/availability.js 1.17 kB {0} [built]
  [91] ./node_modules/vue-style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-627a049c","scoped":false,"hasInlineConfig":true}!./node
_modules/less-loader/dist/cjs.js?{"importLoaders":1}!./assets/src/less/availability.less 1.62 kB {0} [built]
  [92] ./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-627a049c","scoped":false,"hasInlineConfig":true}!./node_modules/less-loader/dist/cjs.js
?{"importLoaders":1}!./assets/src/less/availability.less 1.59 kB {0} [built] [failed] [1 error]
  [95] (webpack)/buildin/module.js 517 bytes {0} [built]
  [96] ./node_modules/moment/locale ^\.\/.*$ 1.95 kB {0} [optional] [built]
    + 103 hidden modules

Как настроить webpack/vue-loader, чтобы он не взрывался при попытке импортировать что-либо?

Вот как выглядит мое файловое дерево:

.
├── assets
│   ├── dist
│   │   └── js
│   │       └── availability.js
│   └── src
│       ├── availability.js
│       ├── components
│       │   ├── Calendar.vue
│       │   └── ...
│       └── less
│           └── fullcalendar.css
├── package.json
└── webpack.config.js

availability.js:

// module dependencies
import Vue from 'vue'

// custom components
import Calendar from './components/Calendar.vue'

new Vue({
  el: '#calendar-component',
  components: {
    calendar: Calendar,
    dateRangeEditor: DateRangeEditor,
    modal: Modal,
  },
  // ... blah blah
});

Calendar.vue:

<script>
export default {
  // ...
}
</script>

<template>
  <div></div>
</template>

<!-- grab the FullCalendar CSS -->
<style lang="less">
  // include FullCalendar styles directly
  @import '../less/fullcalendar.css'; // <-- works without this!
  * { p { color: blue; } }
</style>

Мой webpack.config.js:

const path = require('path');

module.exports = {
  entry: {
    availability: './assets/src/availability.js',
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
          loaders: {
            js: 'babel-loader',
            less: [{
              loader: 'vue-style-loader'
            }, {
              loader: 'css-loader',
            }, {
              loader: 'less-loader',
              options: { importLoaders: 1 },
            }],
          },
          postcss: {
            options: {
              parser: require('postcss-less')
            },
          },
        }
      },
      ...
    ]
  },
  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'assets/dist/js'),
  },
  watch: false,
};

Наконец, мой package.json:

{
  ...
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-helper-vue-jsx-merge-props": "^2.0.2",
    "babel-loader": "^7.1.2",
    "babel-plugin-transform-vue-jsx": "^3.5.0",
    "babel-preset-es2016": "^6.24.1",
    "babel-preset-vue-app": "^1.3.1",
    "css-loader": "^0.28.7",
    "fullcalendar": "^3.5.1",
    "grunt": "^1.0.1",
    "grunt-contrib-copy": "^1.0.0",
    "grunt-contrib-jshint": "^1.1.0",
    "grunt-contrib-watch": "^1.0.0",
    "grunt-webpack": "^3.0.2",
    "less": "^2.7.2",
    "less-loader": "^4.0.5",
    "magnific-popup": "^1.1.0",
    "moment": "2.9.0",
    "postcss-less": "^1.1.1",
    "vue": "^2.4.4",
    "vue-html-loader": "^1.2.4",
    "vue-loader": "^13.0.5",
    "vue-resource": "^1.3.4",
    "vue-style-loader": "^3.0.3",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^3.6.0"
  }
}