Компоненты пакета vue, использующие синтаксис класса

Мне трудно упаковать наши компоненты в пакет npm, чтобы мы могли повторно использовать их в других проектах. У меня такое чувство, что я искал везде в Интернете безрезультатно. Я подозреваю, что использование наших компонентов в стиле синтаксиса класса приводит к тому, что большинство, если не все, примеры для меня терпят неудачу. Последним и наиболее успешным на данный момент был вариант из документации Vue Однако с этим я получаю сообщение об ошибке:

[!] (buble plugin) SyntaxError: Unexpected character '@'

Причиной этого, очевидно, является синтаксис класса с @Component, который сразу же приводит к сбою сборки. Есть ли способ заставить это работать с синтаксисом класса?

Часть скрипта моего компонента выглядит так (ничего особенного в частях css и шаблона):

<script>
import { Vue, Component, Prop } from 'vue-property-decorator';

@Component
export default class Checkbox extends Vue {
  @Prop({default: false}) checked;

};
</script>

vuejs2 vue-cli-3
person jackie.ms    schedule 14.02.2019    source источник

Ответы (1)


arrow_upward
-1
arrow_downward

Я думаю, что проблема в установке vue-loader и vue-template-compiler вместе.

Я Цитирую Vue-loader Vue Docs

Необходим подключаемый модуль! Он отвечает за клонирование любых других определенных вами правил и их применение к соответствующим языковым блокам в .vue файлах. Например, если у вас есть правило, соответствующее /\.js$/, оно будет применено к <script> блокам в .vue файлах.

После того, как вы npm install их, вам нужно изменить свой webpack.config.js файл следующим образом

const VueLoaderPlugin = require('vue-loader/lib/plugin')

module.exports = {
  module: {
    rules: [
      // ... other rules
      {
        test: /\.vue$/,
        loader: 'vue-loader'
      }
    ]
  },
  plugins: [
    // make sure to include the plugin!
    new VueLoaderPlugin()
  ]
}
person Ahm.    schedule 14.02.2019
comment
Если я правильно понимаю, Vue использует Webpack внутри. Команда vue inspect > output.js показывает, что VueLoaderPlugin фактически уже включен. Я предполагаю, что это потому, что мы используем интерфейс командной строки? - person jackie.ms; 14.02.2019
comment
взгляните на этот stackoverflow.com/questions/42749973/ - person Ahm.; 14.02.2019
comment
Извините, но я не вижу в этом вопросе ничего, что могло бы мне помочь :-( - person jackie.ms; 14.02.2019