unplugin vue ce

VUE 3.5가 출시되면 VUE는 사용자 정의 요소를 더 많이 지원합니다. 이 저장소는 미션 (VUE가 사용자 지정 요소에 대한 더 많은 기능을 지원하기 전에 전환 솔루션)을 완료해야 하므로이 저장소는 3.5를 지원하지 않아야합니다. 사용자 정의 요소에 대한 요구 사항을 충족하려면 Vue 3.5.x로 업그레이드하는 것이 좋습니다.

Unplugin-vue-ce

VUE의 사용자 정의 요소 기능을 확장하는 VUE 플러그인 (V- 모델, 어린이 스타일)

영어 | 中文

특징

• ? VUE의 함수 확장입니다
• ? 여러 번들 플랫폼과 호환됩니다 (vite 、 webpack)
• v-model을 지원합니다
• ⚡ 어린이 스타일을 지원합니다

팁 :이 플러그인은 구현 코드를 VUE 런타임에 주입합니다. 사용하는 데 문제가 있으시면 문제를 제출하십시오.

설치하다

npm i unplugin-vue-ce -D

또는

yarn add unplugin-vue-ce-D

또는

pnpm add unplugin-vue-ce -D

용법

팁 : @vitejs/plugin-vue 의 customElement 옵션을 활성화해야합니다.

vite

 // vite.config.ts
import { defineConfig } from 'vite'
import { viteVueCE } from 'unplugin-vue-ce'
import vue from '@vitejs/plugin-vue'
import type { PluginOption } from 'vite'
export default defineConfig ( {
  plugins : [
    vue ( ) ,
    viteVueCE ( ) as PluginOption ,
  ] ,
} )

롤업

 // rollup.config.js
import { rollupVueCE } from '@nplugin-vue-ce'
export default {
  plugins : [
    rollupVueCE ( ) ,
  ] ,
}

웹 팩

 // webpack.config.js
module . exports = {
  /* ... */
  plugins : [
    require ( 'unplugin-vue-ce' ) . webpackVueCE ( ) ,
  ] ,
}

Vue Cli

 // vue.config.js
module . exports = {
  configureWebpack : {
    plugins : [
      require ( 'unplugin-vue-ce' ) . webpackVueCE ( { } ) ,
    ] ,
  } ,
}

Esbuild

 // esbuild.config.js
import { build } from 'esbuild'
import { esbuildVueCE } from 'unplugin-vue-ce'

build ( {
  plugins : [ esbuildVueCE ( ) ] ,
} ) 

V- 모델을 지원합니다

@unplugin-vue-ce/v-model 자세한 내용을보십시오

? 아동 구성 요소의 스타일을 지원합니다

@unplugin-vue-CE/하위 스타일 자세한 내용을보십시오

? 웹 구성 요소를 루트 구성 요소로 사용하는 지원

@unplugin-vue-ce/ce-app 자세한 내용을보십시오

감사해요

• vue-web-component-wrapper