並び順

ブックマーク数

期間指定

  • から
  • まで

81 - 120 件 / 204件

新着順 人気順

"vue 3"の検索結果81 - 120 件 / 204件

  • Vue3 便利帳(随時更新) - Qiita

    Vue開発してて、これは便利だなって裏技がたくさんあるんですが、すぐ忘れてしまい毎回ググらないで済むよう、自分用のメモのつもりでまとめておきます。他にもこんなんあるで!ってのあればぜひ教えてくださいね。 (ps. Vue3 x CompositionAPI x TypeScript に移行したので、内容を書き換え中。) 環境構築、基本設定 Pug の Code Folding を有効にする (VSCode) デフォルトの設定では、.vueファイル上でPugのインデントBlockをFoldできず不便。 setting.jsonに以下を追加するとFoldできるようになります。

      Vue3 便利帳(随時更新) - Qiita
    • 【Vue.js】Vue2→Vue3 主な記述方法の変更点 チートシート - Qiita

      const app = createApp({ // ... }); app.mount('#app');

        【Vue.js】Vue2→Vue3 主な記述方法の変更点 チートシート - Qiita
      • Vue3のCompositionAPIがOptionsAPIよりも優れている理由をVue3エンジニアが解説! | Ragate ブログ

        import { defineComponent, ref } from 'vue' export default defineComponent({ setup() { // data const name = ref('John'); // methods const doIt = () => console.log(`Hello ${name.value}`); // mounted onMounted(() => { doIt(); }); return { name }; } }); 実装上での大きな変更点はこちらでも挙げられている通り、以下になります。 data, computed, method 等の Vue 機能は全て setup 関数に定義ライフサイクルのフックは setup 関数に定義リアクティブ(変更検知)したい値は全て ref で指定必須暗黙的に動作していた部分を全

          Vue3のCompositionAPIがOptionsAPIよりも優れている理由をVue3エンジニアが解説! | Ragate ブログ
        • Nuxt3でvue3-notificationをつかって通知する - くらげになりたい。

          BuefyからTailwind CSSに移行してるけど、 通知を自前で作る必要があるので、いろいろ試してみたときの備忘録。 通知関連のVueコンポーネントはいくつかあるけど、 Vue3対応でメンテナンスされているvue3-notificationを利用 使い方 まずはインストール $ npm install --save @kyvg/vue3-notification プラグインの作成 vueプラグインを使うので、~/pluginsディレクトリに、 ファイル(vue-notification.client.ts)を追加する。 client側のみで利用するので、.clientサフィックスで作成 // ~/plugins/vue-notification.client.ts import Notifications, { notify } from "@kyvg/vue3-notificati

            Nuxt3でvue3-notificationをつかって通知する - くらげになりたい。
          • Vue3解体新書: ビルド環境構築編

            Vue3のエコシステムを理解するためにvue-cliを使用せず、環境構築を行う。

              Vue3解体新書: ビルド環境構築編
            • Announcing Vue 3.3 | The Vue Point

              Today we're excited to announce the release of Vue 3.3 "Rurouni Kenshin"! This release is focused on developer experience improvements - in particular, SFC <script setup> usage with TypeScript. Together with the 1.6 release of Vue Language Tools (previously known as Volar), we have resolved many long-standing pain points when using Vue with TypeScript. This post provides an overview of the highlig

                Announcing Vue 3.3 | The Vue Point
              • Vue 3 解体新書:Vue.js解剖学会

                Vue 3のソースコードに興味を持った有志が集い、ソースコードリーディングに取り組みました! 本誌はその有志が寄稿形式でVue 3のソースコードについて解説したものです。 - Vue 2 と Vue 3の違い - Vue 3 の使い方を解説 - Composition APIについて - Vue 3の内部実装のソースコードの解説 第 1 章 ソースコードリーディング入門以前 第 2 章 リアクティブの書き方の違い 第 3 章 入力バインディング 第 4 章 Template Compiler 第 5 章 computed と Composition API - 追記 - 2020.03.22 第1章と第4章の表記とデザイン崩れの変更を行いました。 また、サポートページの案内を追加しました。

                  Vue 3 解体新書:Vue.js解剖学会
                • Vue3.xから採用予定のCompositionAPIとVue2.xを比較してみる - Qiita

                  はじめに Vueの現在のバージョンは2.6.10ですが、Vue3.x系から新たなAPIの提供がなされるとのことで一足先に試してみました。 使って見た感じ結構良さそうだったので備忘録的に残しておきたいと思います。 ここで作成したコードは以下のリポジトリにアップしてありますので一緒に確認もできます。 https://github.com/tomopict/vue-composition-api-test 前提とする環境 VueCLI v4.0.5 node v10.16.0 yarn v1.13.0 この記事の目的 CompositionAPIとVue2.x系の書き方の比較 ロジックの分離についてVue.js 2.x系との比較 CompositionAPIについて 公式では以下のように言及されています。 a set of additive, function-based APIs that a

                    Vue3.xから採用予定のCompositionAPIとVue2.xを比較してみる - Qiita
                  • がんばらない Vue 3 移行 / Vue 3 Migration without any effort

                    Norimasa Hayashida (LINE株式会社) 「UIT meetup vol.10 『Vue 三昧』」での発表資料です https://uit.connpass.com/event/187267/

                      がんばらない Vue 3 移行 / Vue 3 Migration without any effort
                    • Vue3.xで導入予定のfunction APIを利用してみる - Qiita

                      はじめに liximomo氏が作成されたfunction-apiの実装が本家預かりになったそうなので、改めて利用してみました。vue2.xからpluginという形で利用可能です。 https://github.com/liximomo/vue-function-api/issues/14 ※Evan氏が言う通り、現在RFCでしかもまだ変更が少々入る予定とのこと。利用は慎重に。 vue.js界隈ではココ最近騒動がありまして、キッカケはEvan Youによる function-base API のRFC発表でした。 Published an RFC for function-based component API in Vue. Inspired by React hooks, but rooted in Vue’s reactivity system. Offering better log

                        Vue3.xで導入予定のfunction APIを利用してみる - Qiita
                      • Jest + TypeScript + Vue 3環境で Vue Testing Library(@testing-library/vue) を動かす | フューチャー技術ブログ

                        Jest + TypeScript + Vue 3環境で Vue Testing Library(@testing-library/vue) を動かす フロントエンド連載の1記事目です。 TIG DXユニットの中川旭です。新卒で2020年10月に入社しました。初記事です。 作業が詰まったときや実際に作業するのが面倒なときのために、この記事を最後まで作業をした後のコードを下のリポジトリに置きます。 https://github.com/modockey/Init-VueTestingLibrary Vue Testing LibraryのいいところVue Testing LibraryはVue.js公式のライブラリであるvue-test-utilをベースとする、DOM Testing LibraryのVue.js用拡張です。 Vue Testing Libraryを用いると、Vue.js公式

                          Jest + TypeScript + Vue 3環境で Vue Testing Library(@testing-library/vue) を動かす | フューチャー技術ブログ
                        • All I know about Vue 3's Vapor Mode Details (2023/12) - Qiita

                          Vapor Mode ってご存知でしょうか? 少しでも聞いたことがあるようであれば、おそらくあなたは日常的に情報を収集している熱心な方でしょう。 というのも、現在(2023/12)、Vapor Mode について日本語での言及はほぼありません。 かといって英語圏に情報が出回っているかというと、そうでもありません。(後述) 今回は現時点で筆者が知っている Vapor Mode の詳細について、前提知識も整理しつつ理解していければと思います。 初めに お品書き (何を理解するか) 改めて Vue.js とは これから Vue.js を学び始める方や、Vue.js をのぞいてみるのは随分と久しぶりだという方もいるかと思うので、ざっくりおさらいします 現在の Vue.js 現在の Vue.js がどういう実装で実現されているのか、 Vapor Mode に関わってくる部分を抽出し、ソースコードベー

                            All I know about Vue 3's Vapor Mode Details (2023/12) - Qiita
                          • Vue 3に向けてUIコンポーネントのマイグレーションの検証をしました - VisasQ Dev Blog

                            ビザスクlite事業部フロントエンドエンジニアの小柳(@mascii_k)です。 弊社ではモダンなフロントエンド開発手法にシフトしつつあり、Figma で構築したデザインシステム上でデザインし、それに対応するものを Vue.js 2.x 系で実装する開発がスタンダードとなっております。 現在 Vue.js 3.0.0 の正式リリースが間近とされていて、弊社としても積極的にマイグレーションをしていきたいと思っております。 今回は Vue 2.x 系向けに作られた UI コンポーネントの Vue 3.0 系へのマイグレーションに向けた検証結果を公開します。 弊社の UI コンポーネント事情 弊社では Vuetify や Element UI といったコンポーネントフレームワークには依存せず、極力スクラッチで UI コンポーネントを作って開発しています。 Figma を活用して管理されているデザ

                              Vue 3に向けてUIコンポーネントのマイグレーションの検証をしました - VisasQ Dev Blog
                            • 【Vue 3】Composition API の基本

                              はじめに※ Vue 2の知識があることを前提の記事となっています。 今回の題材である Composition API 導入により、Vueの<script>部分の記述が大きく変わります。 Vue 2からVue 3への変更で一番大きなものは Composition API の導入と言っても過言ではないでしょう。 Composition APIは、Vue 2でも拡張機能として導入することはできましたが、多くのユーザーは基本的な Options API を使用していたはずです。 Options APIでは、オブジェクトプロパティとしてdataやmethodsなどの役割ごとにまとめて記述していました。 <script> export default { data: () => ({ count: 0, }) methods: { increment() { this.count++; }, decr

                                【Vue 3】Composition API の基本
                              • 2021-09-21のJS: Deno 1.14リリース、ChromeのUser-Agent文字列削減スケジュール、Vue 2からVue 3への移行

                                JSer.info #558 - Deno 1.14がリリースされました。 Deno 1.14 Release Notes | Deno Blog Deno 1.14.0 がリリースされたので新機能や変更点の紹介 deno lintとdeno fmtがオプションをサポートしてquoteやindentなどの設定ができるようになっています。 URLPatternのサポート。fetchがMutual TLSをサポートなども追加されています。 また、unstableな機能としてFile locking APIsのサポートが追加されています。 その他にはURL parsingやstd/httpモジュールのパフォーマンス改善などが含まれています。 ChromeのUser-Agent文字列削減のスケジュールが改めて公開されています。 Chromium Blog: User-Agent Reduction

                                  2021-09-21のJS: Deno 1.14リリース、ChromeのUser-Agent文字列削減スケジュール、Vue 2からVue 3への移行
                                • Nuxt で Vue 3.0 (Composition-API) を使いたいとき - ハードルを下げ続けるブログ@task

                                  ja.nuxtjs.org composition-api.nuxtjs.org Vue3.0 がリリースされてからしばらく立ちましたが、Nuxt において Vue3.0 がサポートされた v3.0 がリリースされるのはもうちょっとかかりそうです。 とはいえ、v3.0 がリリースされるのを待って、無理やりバージョンをあげようとしてもおそらく、かなりの痛みを伴うことが、他の皆様のVue3.0移行記事からも読み取れます。 そこで、Vue 3.0 リリースより少し前から、既存の Nuxt Project に composition-API を導入した所感と、導入方法を記録しておきます。 というか、この過渡期においてNuxtへの Composition-API 導入についての日本語記事があまり見当たらなかったので、少しでも参考になれば幸いです。 なお、バージョンは記事公開時点の最新とします。 Nu

                                    Nuxt で Vue 3.0 (Composition-API) を使いたいとき - ハードルを下げ続けるブログ@task
                                  • Vue2からVue3への変化と慣れていくためのTips

                                    モチベーション Vue2系サポート終了(23年末予定)を踏まえて、今後はVue3に触れる機会が増えそう 現在Vue2を使っているけどVue3へリファクタする予定があり、慣れていく必要が出てきた 記事の内容 Vue3を取り巻く環境とかエコシステムなど整理 Vue3に慣れる為に知っておくべきことを整理 移行に伴う破壊的変更の内容などは記載してない ある程度Vue2を触った事があるのを前提で書いてる部分が多いです なぜVue3に慣れる必要があるのか 1. Vue2のサポート終了 Vueの公式によるとVue2系が2023年の末に終了されることが告知されています。 Vue2系は2022年6月にリリースされた2.7系が最後で、今後は新しい機能などは追加されず、セキュリティ対応など最低限のアップデートのみの対応となります。 それに伴ってVue2からVue3へリファクタ等の対応する必要があります。 2.

                                      Vue2からVue3への変化と慣れていくためのTips
                                    • 簡単な例で始めるVue3でTypeScript入門 | アールエフェクト

                                      以前はVueのプロジェクトの作成する際はVue CLIを利用することが推奨されていましたが2022年2月からVue3がデフォルトのバージョンとなりVue CLIはメンテナンスモードに入りました。新規にプロジェクトを作成する場合はViteを元にしたnpm install vute@latestコマンドを利用することが推奨されています。 本文書では現在推奨されているViteベースのプロジェクト作成ツールとVue CLIを利用した手順について説明を行っています。 環境構築(Viteベース) Vue.jsプロジェクトを作成するためにnpm init vue@latestコマンドを実行します。npm init vue@latestを実行すると裏側ではcreate-vueが実行されます。 % npm init vue@latest create-vueではプロジェクト名とプロジェクトに追加する機能を聞

                                        簡単な例で始めるVue3でTypeScript入門 | アールエフェクト
                                      • Vue 2の開発を出来るだけVue 3に近づけるための基本テクニック - Link and Motivation Developers' Blog

                                        こんにちは、リンクアンドモチベーションのプラットフォームチームの菊池です。 普段はアプリケーション開発のプロジェクトマネジメントをしたり、横断でフロントエンドを見ていたりします。 さて先日、長らくnextバージョンであったVue 3が2022年2月7日からデフォルトバージョンになることが発表されました。 https://blog.vuejs.org/posts/vue-3-as-the-new-default.html 公式が推奨するビルドツールや状態管理ライブラリもViteやPiniaに変わって新時代って感じですね。 一方でまだVue 2を現役で使っているプロダクトも多いと思います。 弊社のフロントエンドも全てVue 2で書かれており、ブラウザ互換を保つため、最近開発をしたアプリケーションでもVue 2(Nuxt) + TypeScriptの構成を取っています。 が、すぐにVue 3にア

                                          Vue 2の開発を出来るだけVue 3に近づけるための基本テクニック - Link and Motivation Developers' Blog
                                        • Advanced TypeScript: A Type Safe Store for Vue 3

                                          Like my content? Sign up to get occasional emails about new blog posts and other content. EmailSubmit Unsubscribe anytime here.Writing A Type Safe Store In this article we explore some advanced TypeScript while building a type safe store with a similar API to Pinia or Vuex 5 (which is still in the RFC stage). I learned a lot of what was needed to write this article by reading the Pinia source code

                                            Advanced TypeScript: A Type Safe Store for Vue 3
                                          • 2022年4月現在 Vue3 + Vuetify3(Beta)でどこまでできるか

                                            昨年、Zenn に Vue を使ったアプリの作り方について投稿しました。 上記投稿時点で Vue3 を使うことはできましたが、使おうと思っていた UIフレームワークの Vuetify が Vue3 に対応していなかったので、Vue2 を使っていました。 あれから半年以上たって、Vue3 対応の Vuetify3 がアルファからベータ版になり、 公式サイトを見るといろいろできそうな感じに見えたので、試しに Vue3 + Vuetify3 で Webアプリを作ってみました。 目標 先日、オープンデータカタログサイトリストの Web API を以下のサイトに公開しました。 ここで公開したデータの検索サイトを作ろうと思います。 一応目標として、このサイト(React + Material-UIで作成)のような見た目を目指すことにしました。 出来たもの こんな感じにしあがりました。 Vuetify3

                                              2022年4月現在 Vue3 + Vuetify3(Beta)でどこまでできるか
                                            • 2021-08-10のJS: pnpm 6.12.0、webpack 5.49.0(import http resource)、Vue 3.2

                                              JSer.info #552 - パッケージマネージャであるpnpm 6.12.9がリリースされました。 Release v6.12.0 · pnpm/pnpm pnpm 6.12.0ではpnpm env use --global 16.5.0のように、Node.jsをインストールするコマンドが追加されています。 pnpm自体をsingle binaryとして配布した場合に、Node.jsがグローバルにインストールされていない環境でもpnpmが利用できるようになります。 そのような場合に、pnpmでNode.jsをインストールするためにpnpm envが追加されています。 Using pnpm as a Node.js version manager · Discussion #3434 · pnpm/pnpm webpack 5.49.0がリリースされました。 Release v5.49

                                                2021-08-10のJS: pnpm 6.12.0、webpack 5.49.0(import http resource)、Vue 3.2
                                              • 同じページにVue2とVue3のコンポーネントを描画する

                                                import Vue2 from 'vue' import * as Vue3 from 'vue3' window.onload = () => { const App2 = Vue2.extend({ name: 'App2', data() { return {message: 'Vue 2!'} }, template: `<p>Hello {{message}}</p>`, created() { console.log(`created v2`) } }) const app2 = new Vue2({ components: {App2}, template: `<App2 />`, }) app2.$mount('#vue2') const App3 = { data() { return {message: 'Vue 3!'} }, template: `<p>Hello

                                                  同じページにVue2とVue3のコンポーネントを描画する
                                                • Vue 3 is now in RC! · Issue #189 · vuejs/rfcs

                                                  Vue 3 is now in RC! We are very excited to announce that Vue 3.0 has entered RC (Release Candidate) stage! Entering the RC stage means that both the API and implementation of Vue 3 core have stabilized. In principle, we do not expect to introduce new major features or breaking changes before the final release. Most official framework parts also now have v3 support. Please check here for the latest

                                                    Vue 3 is now in RC! · Issue #189 · vuejs/rfcs
                                                  • 破壊的変更を乗り越えてVue3移行達成した話

                                                    はじめにこの記事では、私たちが開発しているAnewsというプロダクトでのVue 3移行プロジェクトについて紹介していきます。 Anewsはビジネス向けにユーザーの趣向に合わせて日々のニュースなどの最新情報を提供するプロダクトです。フロントエンドはVue.jsというフレームワークを使用しています。2023年末にVue 2のサポート期限が迫っており、それまでにAnewsのVue 3移行を完遂すべく、Vue 3移行プロジェクトを行いました。 そこで得られた知見としてVue 2とVue 3の違いや、必要だった対応、実際に行った移行戦略などまとめていきたいと思います。 移行前の環境今のAnewsは2020年に開発がはじまり、AnewsはVue 2.6.12、TypeScriptを使用していました。 TypeScriptを活用して開発するため、TypeScriptのクラスでVueのコンポーネントを定義

                                                      破壊的変更を乗り越えてVue3移行達成した話
                                                    • 既存のVue.jsプラグインがVue 3で使えない場合の対応 - Qiita

                                                      いくつかのパターンをまとめましたが、簡単な修正だけで直るケースも多いです。 ただし、基本的にはプラグイン側の修正が必要なので、ここではその修正箇所をまとめています。 目次: ケース1: this.$xxx() 系のプラグインで起きる問題 Composition APIで使う ケース2: <div v-xxx>系のプラグインで起きる問題 ケース3: コンポーネント系プラグインで起きる問題 補足1: Vue.jsとVue 3両方に対応させる 補足2: プラグインの修正ってどうやるの? ケース1: this.$xxx() 系のプラグインで起きる問題 Vueインスタンスメソッドに機能が拡張されるタイプのプラグインで起きるのは、 プラグインのインストール時、Vueのprototypeの拡張に失敗しているという事象です。 Uncaught TypeError: Object.definePropert

                                                        既存のVue.jsプラグインがVue 3で使えない場合の対応 - Qiita
                                                      • JavaScriptフレームワーク「Vue 3」と「Nuxt 3」の活用一覧

                                                        CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

                                                          JavaScriptフレームワーク「Vue 3」と「Nuxt 3」の活用一覧
                                                        • 6歳娘「パパ、Vue3のComposition APIってどう使うの?」 - Qiita

                                                          今回使った技術 Vue3 Nuxt3(ベータ版) TypeScript ある日の我が家 娘「ねぇ、パパ!」 娘「Vue3の、Composition APIの使い方を教えて!」 ワイ「おお、ええで〜」 ワイ「ほな、試しにこんな感じのページを作っていくで!」 娘「わー、数をカウントできるページなんだ!」 娘「便利そう〜!」 娘「しかも、2倍の数も確認できるんだね!」 ワイ「げへへ、照れるでぇ」 ワイ「ほな、さっそく作っていくで〜」 カウンターを作っていく ワイ「まずは、カウンターの数値が今いくつなのか」 ワイ「その状態管理をせなあかんから」

                                                            6歳娘「パパ、Vue3のComposition APIってどう使うの?」 - Qiita
                                                          • Vue3でフォームバリデーションのVee-Validate4の基礎を理解 | アールエフェクト

                                                            入力フォームを作成した場合には必ずバリデーション処理を実装する必要があります。バリデーションはユーザが入力フォームから入力した値が要件を満たしているかチェックを行う仕組みです。例えばネット上のサービスを利用する場合にはメールアドレスの入力を求められます。入力時にメールアドレスの形式になっているかどうかチェックを行うのがバリデーションです。 フォームバリデーションには入力値をチェックするだけではなくエラーメッセージの管理、入力したデータの管理、submit処理など含まれ、すべて自分で実装しようとすると非常に大変な作業になります。vee-validateなどのライブラリの力を借りることでフォーム作成の負担を下がることができフォーム以外の処理に時間をかけることができます。ライブラリを利用することで自分で実装することに比べて楽にはなりますが初めて利用する場合は利用方法が難しいと感じるかもしれません

                                                              Vue3でフォームバリデーションのVee-Validate4の基礎を理解 | アールエフェクト
                                                            • Understanding Reactivity in Vue 3.0

                                                              This article is just written for my knowledge and understanding of the coolest part in Vue: the reactivity system. Background As we know, Vue.js team is working on 3.0 for a while. Recently it released the first Beta version. That means the core tech design is stable enough. Now I think it's time to walk through something inside Vue 3.0. That's one of my most favorite parts: the reactivity system.

                                                                Understanding Reactivity in Vue 3.0
                                                              • Vue.js 3 ハンズオン | Vue3 Hands-on

                                                                Vue.js 3 ハンズオン ​Vue.js 3 ハンズオンへようこそ😀 このハンズオンは、初めて Vue.js に触れる人がスムーズに学習できるように作られた学習用教材です。 利用方法 ​本ハンズオンの文章、ソースコードを含むあらゆる内容は、自由にご利用いただけます。個人の学習や、グループ・会社での勉強会、もくもく会、セミナーなど、あらゆる用途にご活用ください。 現在は、Vue.js のプロジェクト作成から基本的な実装方法を解説した「Vue.js をはじめよう!」を公開しています。その他のハンズオンは鋭意制作中です。 Vue.js をはじめよう! ​準備編 ​開発環境の構築プロジェクトの作成本編 ​ハンズオンの概要data を定義し、商品をレンダリングするv-for で商品を複数表示するv-if で表示・非表示を切り替えるmethods で価格にカンマを入れる@click で商品を選択

                                                                • Vue3のinject/provideでミニマルなストアを作る - うしろのこの本ください

                                                                  ストアの型はサボった。 github.com Vue3からinjectとprovideという関数が提供されており、(機能的にはVue2のものと同じだが)コンポネ間の状態共有が簡単にできるようになった。 ドキュメント https://composition-api.vuejs.org/api.html#dependency-injection 簡単に言うと、provideにキー付きで渡したリアクティブな状態をinjectで取り出すことでどこからでも状態を参照できるようになるもの。 provideとinjectはsetupでのみ動作する。 例えば状態を共有したいコンポーネント2つがあった時、それ用のスコープでディレクトリを切って専用のストアを作ることが可能。 Symbolを使って一意のキーを生成し、リアクティブにしたい状態や関数をセットでprovideに渡す。 components/miniS

                                                                    Vue3のinject/provideでミニマルなストアを作る - うしろのこの本ください
                                                                  • 頑張らない Vue3 開発環境構築

                                                                    あんまり頑張らずに開発できる環境を目標にする。実現したいのはこれくらい。 最終的な構築結果は https://github.com/toruuetani/vue3starter にある。 Vue3 + VSCode + TypeScript + Vuex + VueRouter で開発する。 Vue3.2 から使える <script setup> 構文を使えるようにする。 ビルドツールには Vue/CLI ではなく Vite を使う。 現代のプログラミングにおいて Linter や formetter は当然なので、 ESLint + Prettier を導入する。 前提とするバージョンは以下の通り。 Windows 10 20H2 nvm-windows 1.1.8 Node.js 14.18.2 ※ v14 は特に意味はない。 v16 でも問題ないはず。 npm 6.14.15 ※ y

                                                                      頑張らない Vue3 開発環境構築
                                                                    • GitHub - antfu-collective/vite-ssg: Static site generation for Vue 3 on Vite

                                                                      You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                                                        GitHub - antfu-collective/vite-ssg: Static site generation for Vue 3 on Vite
                                                                      • 2021-06-08のJS: Lighthouse 8.0.0(スコア計算の変更)、Vue 3.1(@vue/compat)、 Mocha v9.0.0

                                                                        JSer.info #543 - Lighthouse 8.0.0がリリースされました。 Release v8.0.0 · GoogleChrome/lighthouse Lighthouse 8.0.0ではパフォーマンススコアの計算式が変更されています。 詳細は次のドキュメントにかかれていますが、今まで実験的だったCumulative Layout Shift (CLS)の比重が5%から15%へと増加しています。それにあわせて他のスコアの比重も変化しています。 lighthouse/v8-perf-faq.md at master · GoogleChrome/lighthouse 機能追加として、レポートをメトリクス別にフィルターできるように、csp-xssのAuditの追加なども含まれています。 Vue 3.1.0がリリースされました。 Release v3.1.0 Pluto ·

                                                                          2021-06-08のJS: Lighthouse 8.0.0(スコア計算の変更)、Vue 3.1(@vue/compat)、 Mocha v9.0.0
                                                                        • 【完全解説】create-vueでVue3プロジェクト作成〜Vite爆速開発〜 | アールエフェクト

                                                                          create-vueはVue公式のVueプロジェクト作成ライブラリです。npm init vue@latestコマンドを実行することでVueプロジェクトの骨組み(scaffolding)の作成とVueのアプリケーション構築に欠かすことできない機能を選択してプロジェクトに追加を行うことができます。本文書はVueの入門者の人がcreate-vueを利用してプロジェクトを作成する際に追加できるすべての機能がどのような役割を持っているのか理解できることを目的にしています。各機能の理解が進むことで機能追加時に迷うことなく自信を持って機能の選択を行うことができます。create-vueではビルドツールとして現在人気急上昇中のViteが利用されているのでViteについて動作確認をしながら説明を行なっているので開発環境と本番環境でのビルドツールの違いなども理解することができます。 VueのプロジェクトはV

                                                                            【完全解説】create-vueでVue3プロジェクト作成〜Vite爆速開発〜 | アールエフェクト
                                                                          • Amplify JavaScript が新たに Vue 3 をサポート | Amazon Web Services

                                                                            Amazon Web Services ブログ Amplify JavaScript が新たに Vue 3 をサポート この記事は、Amplify JavaScript releases support for Vue 3を翻訳したものです。 本日より、Amplify JavaScript は現在対応しているVue.jsバージョン2に加え、新たにVue.jsバージョン3へ対応します。オープンソースの Amplify Librariesは、あらゆるカテゴリのクラウドを使ったオペレーションに対し、ユースケース中心の、独自のスタイルを持った、宣言型で使いやすいインターフェイスを提供し、モバイル開発者やウェブ開発者がバックエンドと簡単にやり取りできるようにしています。これらのライブラリは AWS クラウド技術に支えられており、プラグイン可能なモデルのため、他のプロバイダを利用するよう拡張することも

                                                                              Amplify JavaScript が新たに Vue 3 をサポート | Amazon Web Services
                                                                            • MedPeerをVue 3にアップデートしました🥳 - メドピア開発者ブログ

                                                                              こんにちは、MedPeerのフロントエンド開発を主に担当している森田です。 MedPeer( https://medpeer.jp )ではVue 2 系を長らく利用してきましたが、公式からの発表の通り 2023年12月31日 でEOLとなっております。 With 2024 almost upon us, we would like to take this opportunity to remind the Vue community that Vue 2 will reach End of Life (EOL) on December 31st, 2023. https://blog.vuejs.org/posts/vue-2-eol EOLを迎えても直ちにセキュリティリスクに晒される可能性は少ないとは思いますが、 MedPeerは医療を扱うサービスの特性上セキュリティリスクは最小限に抑

                                                                                MedPeerをVue 3にアップデートしました🥳 - メドピア開発者ブログ
                                                                              • Vue3でモーダルダイアログの起動をいい感じに実装する | フューチャー技術ブログ

                                                                                Reactでのダイアログの開閉制御については以前、別のエントリーで書きました。 ダイアログもアラートも、Reactで子コンポーネントの開閉管理を実装するVue3でも、何か簡単に書ける方法はないかと試行錯誤して、ちょっといい感じかな?という方針を見つけたので、備忘がてら技術ブログに書いておきます。 使いやすいダイアログAPIとは太古の昔より、便利なダイアログ機能というのは、呼び出し元はダイアログの開閉状態とか細かい制御は気にせず、必要な情報を渡して、結果だけもらうというものです。JavaScriptのブラウザのAPIにもありますよね。 const result = confirm("今日はいい天気でしたね") // OKのときはtrue console.log(result) これはVisual Basicとかでもなんでも同じですね。ただし、JavaScriptだとconfirm()、ale

                                                                                  Vue3でモーダルダイアログの起動をいい感じに実装する | フューチャー技術ブログ
                                                                                • クラスベースAPIから再利用および構成の可能な関数ベースアプローチへと移行したVue 3.0

                                                                                  原文(投稿日:2019/07/06)へのリンク Vueチームは先頃、近くリリースされるVue 3用で導入される予定の、関数ベースのコンポーネントAPIについて説明するRFCを公開した。React Hooksのような関数ベースの、このコンポーネントAPIでは、ロジックをいわゆる"合成関数(composition function)"にカプセル化することで、コンポーネント間での再利用を可能にする。さらに、従来より優れた組み込みTypeScript型推論サポートを、現在は廃止されているClass API RFCでは不可能であった方法で提供している。Vue 3の新APIは、既存のVue 2コンポーネントAPIを代替するものではなく、並列して存在するものになる。 Vueの作成者であるEvan You氏は、関数ベースのコンポーネントAPIを提案する背景となった動機について、次のように説明している。 論

                                                                                    クラスベースAPIから再利用および構成の可能な関数ベースアプローチへと移行したVue 3.0