Однофайловые компоненты vue3

[Voral]

Очень нужны документация и пример. Перечитал перепроверил два закрытых тикета. Прочитав их добился что вроде как начинает компилироваться, но выдает Error: Cannot read properties of undefined (reading 'type')

Переустановил, как сказано, в закрытом тикете bitrix/cli теперь вернулась Error: Unexpected character '#' (5:4) in ..../local/js/test/test/src/test.js

Код следующий bundle.config.js

const isProd = process.argv.includes('--prod');
const vuePlugin = require('rollup-plugin-vue');
const commonjs = require('rollup-plugin-commonjs');

module.exports = {
    input: 'src/test.js',
    output: 'dist/test.bundle.js',
    namespace: 'BX.Test',
    browserslist: true,
    minification: isProd,
    sourceMaps: !isProd,
    plugins: {
        custom: [
            vuePlugin(),
            commonjs(),
        ],
    },
};

test.js

import {BitrixVue} from 'ui.vue3';
import Hello from "Hello.vue";

export class Test {
    #application;
    #rootNode;

    constructor(rootNode): void {
        this.#rootNode = document.querySelector(rootNode);
    }

    start(): void {
        this.#application = BitrixVue.createApp({
            name: 'Example',
            components:{
                Hello
            },
            template: '<div>Test: <Hello/></div>'
        })
        this.#application.mount(this.#rootNode);
    }
}

Hello.vue

<template>
  <p class="greeting">{{ greeting }}</p>
</template>

<script>
export default {
  data() {
    return {
      greeting: "Привет всем!"
    }
  }
}
</script>

<style>
.greeting {
  color: red;
  font-weight: bold;
}
</style>

Info @bitrix/cli, v3.1.1

[Voral]

package.json

{
  "dependencies": {
    "rollup-plugin-commonjs": "^9.0.0",
    "rollup-plugin-vue": "^5.0.0"
  }
}

[Voral]

Info @bitrix/cli, v3.2.2, так же

   Build error: Unexpected character '#' (5:4) in .../local/js/test/test/src/test.js
   .../local/js/test/test/src/test.js:5:4

[druxik]

Есть у кого-нибудь рабочий пример с однофайловыми компонентами vue3? когда делаю import App from "./components/App.vue"; в bunle закидывается не та переменная Посмотрел в исходник, что пытается подключить cli [ 'ui.vue3', 'vue' ] 'vue' появляется, когда делаю import App from "./components/App.vue";

[Voral]

Есть у кого-нибудь рабочий пример с однофайловыми компонентами vue3?

Долго пытался найти решение и в поддержку обращался (ответили что не поддерживается). В итоге либо без однофайловых либо использую vite (т.е без bitrix/cli)

[druxik]

да, тоже получил ответ от поддержки, печально(

[svn72]

Есть у кого-нибудь рабочий пример с однофайловыми компонентами vue3?

Пропатчи себе bitrix/cli изменениями из #59 и будет тебе счастье, там дел на пару строк кода

[druxik]

Есть у кого-нибудь рабочий пример с однофайловыми компонентами vue3?

Пропатчи себе bitrix/cli изменениями из #59 и будет тебе счастье, там дел на пару строк кода

Как это правильно делается, никогда этого не делал) Допустим я установил cli через npm и он находится по пути C:\Users\Roma\AppData\Roaming\npm\node_modules@bitrix\cli Туда иду и делаю следующее git init git commit .... curl https://patch-diff.githubusercontent.com/raw/bitrix-tools/cli/pull/59.patch | git am Получаю Patch is empty. Как это правильно делается? Желательно, чтобы это легко повторили другие разработчики из команды)

[svn72]

@druxik

Получаю Patch is empty.

Судя по документации git am требует именно файл, потому и ошибка. У меня срабатывает следующий порядок действий (нода - v20.10)

Туда иду и делаю следующее

git init
git commit ...
wget https://patch-diff.githubusercontent.com/raw/bitrix-tools/cli/pull/59.patch
git apply 59.patch
npm run build

Абсолютно стабильным этот алгоритм не назвать, т.к. версия в npm часто выше чем тут в репозитории.
Так, что будем ждать.
Возможно ПР когда-то вольется, или мейнтейнеры что-нибудь доработают по своему, и можно будет писать vue компоненты как написано в доке по vue