Vue.js를 사용하여 풍부한 응용 프로그램을 만들었습니다. 양식이 번거롭기 때문에 잘 할 수 있을 것 같아서 가르침을 청했습니다Quasar Framework!

Quasar Framework란 무엇입니까?

뭐랄까, 스펀지 같은 사이트나 PWA 같은 로컬 앱 바람을 만들 수 있을 것 같고, 일렉트로닉 앱도 만들 수 있을 것 같다.
awesome-vue UI 섹션에 정렬됩니다.

Getting Started

Components 페이지를 봤는데 이거 좋잖아요!그래서 한번 써보고 싶어요.
Getting Started 페이지를 보았습니다. First Stops에서...

# installing Quasar CLI
$ npm install -g quasar-cli

Quasar CLI 같은 걸 넣어야 할 것 같아요.
근데 저는 Quasar Framework를 기존 물건에 넣고 싶어요!그래서 못 들어갔어요.
※ Quasar CLI에 가입하지 않으면 이동이 불가능할 수도 있지만 아직 모릅니다.자세하게 적어주세요!

기존 Vuejs 응용 프로그램 넣기

$ vue init webpack myapp

이렇게 init 항목을 참고로 쓰세요!

Quasar Framework 설치

$ yarn add quasar-framework
$ yarn add quasar-extras # icons使わないなら入れなくてもOK!

설치 후 에 추가src/main.js.이 일대는quasar-cli의 틀을 보면 알 수 있다.
quasarframework/quasar-template-default
src/main.js

import Quasar, * as All from 'quasar-framework'

// ios風のデザインなら quasar.ios.css
// マテリアルデザイン風なら quasar.mat.cssを読み込む
import 'quasar-framework/dist/quasar.ios.css'
//import 'quasar-framework/dist/quasar.mat.css'

// iconもいろいろ選べる
import 'quasar-extras/material-icons'
// import 'quasar-extras/ionicons'
// import 'quasar-extras/fontawesome'

// アニメーションのときに使うみたいです。
import 'quasar-extras/animate'

// すべてのコンポーネントを使いたいのでこうしてます
Vue.use(Quasar, {
  components: All,
  directives: All
})

시용하다

그 후로 아무런 걱정이 없어졌다.Components 페이지에서 사용하고 싶은 구성 요소를 선택하세요!
이번에는 버튼을 사용해 보자.

<template lang="html">
  <div>
    <q-btn icon="create" color="secondary">さくせす！</q-btn>
  </div>
</template>

<script>
export default {
}
</script>

<style lang="css">
</style>

하다