Использование lang = "pug" с Quasar CLI - PullRequest
1 голос
/ 01 мая 2019

Я запустил новый CLI-проект Quasar и хотел бы использовать Pug так, как я привык: добавляя тег lang="pug" в некоторые из моих файлов .vue:

<template lang="pug">
  q-page(class="flex flex-center")
    p Well hello there
...

Это выдает эту ошибку:

Шаблон компонента требует корневого элемента, а не просто текст

Совет, данный Quasar, заключается в добавлении этой конфигурации:

// quasar.conf.js
build: {
  extendWebpack (cfg) {
    cfg.module.rules.push({
      test: /\.pug$/,
      loader: 'pug-plain-loader'
    })
  }
}

Но это предполагает, что все мои файлы мопса находятся в файлах, называемых .pug, что не является моим предпочтением.

Есть ли способ заставить lang="pug" работать как обычно вмои проекты vue-cli?

Quasar CLI ........ v0.17.24

Quasar Framework .. v0.17.20

1 Ответ

2 голосов
/ 07 июня 2019

Это должно работать как есть. Я настроил новый квазар-проект и добавил pug в правила веб-пакета, например:

extendWebpack (cfg) {
        cfg.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /node_modules/
        })
        cfg.module.rules.push({
          test: /\.pug$/,
          loader: 'pug-plain-loader'
        })
      }

Мой app.vue выглядит так

<template lang="pug">
  div(id="q-app")
    router-view
</template>

И все работает. Я использую квазар 1.0 бета и его формат проекта по умолчанию, созданный при создании с помощью CLI.

...