Hatena Blog Tags
はてなブログ トップ
Vite
このタグでブログを書く
言葉の解説
ネットで話題
関連ブログ

Vite

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
usomaru技術ぶろぐ•17日前

Vite設定ファイルの基本と他ツールとの違いまとめ

はじめに 前回ビルドツールについてまとめました。 今回はViteで使う設定ファイル(vite.config.ts)を中心に、設定ファイルについてまとめます。 defineConfig を使ったVite設定の基本 Viteの設定ファイルは通常、プロジェクトルートに vite.config.ts として配置されます。 以下中身の一例です。 import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react-swc'; import { resolve } from 'path'; export default d…

#react#Vite

関連ブログ

usomaru技術ぶろぐ•21日前

Reactに乗り換えて初めて意識した、JavaScriptアプリケーションのビルドツール（Vite vs Webpack）

ブログのタイトルをいれたら生成された画像 はじめに Angularを使っていた頃は、ビルドツールについて深く考えたことはありませんでした。 CLIが勝手になんかいい感じにやっていたからです。 ですがReactでは、「どのビルドツールを使うか？」という選択から始まることを知りました。 そこで、「ビルドツール」について、自分なりに調べて整理してみたいと思います。 Angularのビルド Angular CLI を使ってアプリケーションを作っていると、ng build や ng serve などのコマンドひとつでローカル開発・本番ビルドができます。 そして、ビルドや開発サーバー、テスト、lint な…

#Vite#Angular
AKARI Tech Blog•3ヶ月前

Vitest と GitHub Copilot で Frontendの単体テストを書く

改めまして、燈株式会社 AI SaaS事業本部VPoEの小田川です。 燈株式会社のデジタルビルダーでは最近、フロントエンドのテストコードの拡充を行っています。 このテスト拡充の背景には、デジタルビルダーが請求書処理を含む業務フローにおいて高度なカスタマイズを許容しているという特性があります。 このカスタマイズの多様性により、「どの条件で何が表示されるべきか」「各ボタンがどのように機能すべきか」といった振る舞いのパターンが増え、仕様の複雑性も高まっています。 こうした仕様を品質保証（QA）工程にのみ依存するのではなく、開発の初期段階から自動化されたユニットテストで担保し、CI上で高速かつ頻繁に実…

#react#vitest#frontend test#Vite#frontend
てくぶろ！•4ヶ月前

Web上で二人でコリドールできるページを作ってみた

TL;DV 公開したリポジトリ・ページ 作った経緯 使用技術 Vite + React Tailwind CSS + daisyUI GitHub Pages Jotai コリドールのアルゴリズム 今後の課題 工夫した点 文字列から盤面を復元する機能を作った 最後に TL;DV 以下のようなWeb上で二人でコリドール対戦できる静的ページを作成しました。 機能は非常にシンプルで、その場にいる二人で対戦できるのみです。 オンラインで誰かとマッチしたり、AIと対戦できる機能はありません。（今後増やすかもしれませんが） 作成したページのスクリーンショット 公開したリポジトリ・ページ リポジトリ git…

#コリドール#Vite#Tailwind CSS#react#GitHub Pages
青いやつの進捗日記。•5ヶ月前

viteを5.4.12にあげる必要があるセキュリティ警告が出ていたのでアップデートしたらallowedHostsの設定が必要になり、allowedHostの設定によってviteのhmrのWebSocket接続のホスト名が変わる

先に結論 allowedHostsを設定する allowedHostsを.ではじめる指定かどうかでVite開発用WebSocket（HMR）のホスト名が変わるので注意 Viteのセキュリティ警告が出たので、アップデート $ yarn npm audit └─ vite ├─ ID: 1101618 ├─ Issue: Websites were able to send any requests to the development server and read the response in vite ├─ URL: https://github.com/advisories/GHSA-v…

#Vite#hmr#WebSocket
saruboの書き溜め•6ヶ月前

SolidStart の proxy で websocket を使う target を指定する

結論 SolidStart の proxy で websocket を使う target を指定するためには vite.server.proxy を通常通り指定 server.experimental.websocket = true にする 結果、 app.config.ts (app.config.js) は以下のようになる。 ("/websocket": "http://localhost:3001" のあたりなんかは都合よく置き換え) import { defineConfig } from "@solidjs/start/config"; export default defineC…

#SolidStart#Proxy#WebSocket#Vite#Vinxi
iimon TECH BLOG•6ヶ月前

歴史を感じつつ、クロージャで遊んでみた（JavaScript編）

こんにちは！株式会社ｉｉｍｏｎでフロントエンジニアをしている「ひが」です！ 本記事はアドベントカレンダー19日目の記事になります！ 先日夢で「メリークロージャマス！！！」と叫んでスベる夢を見ました。 冬だからか、みなさん冷たかったです（現実では暖かいです） そのようなこともあり、思い切って記事にしてみようと思いました！ どうか、暖かい目で見守っていただけると嬉しく思います！！ 本題 本題ですが、みなさんはクロージャをご存知でしょうか。 MDNよりお言葉を借りると クロージャは、組み合わされた（囲まれた）関数と、その周囲の状態（レキシカル環境）への参照の組み合わせ です！ 初見だと何言ってるかよ…

#iimon world#frontend#Advent Calendar 2024#Vite#Closure
無駄と文化•8ヶ月前

Vitest を使って wasm のテストを書く

wasm-bindgen で生成したコードに対してテストを書くときの話題です。 Rust からコンパイルした wasm に対してテストを書くとき wasm-bindgen-test がおすすめされがちです。 wasm-bindgen-test は Rust でテストを書き wasm にコンパイルして実行します。ただテストコード自体を wasm にコンパイルする方法だとコンパイル過程に問題があったときにわかりづらそうで少し嫌です。 JavaScript から呼び出す想定の wasm なら JavaScript でテストコードを書くのがわかりやすいと思います。 というわけで Vitest を使って…

#WebAssembly#ユニットテスト#Vite
shu915’s blog•8ヶ月前

ViteのReactの環境変数を扱う

開発環境と本番環境で、urlなどが違うとき、 手動で、その都度書き換えると大変なので、環境変数を使いましょう。 ViteのReactの場合は、そうではない場合とやり方が違うので、解説したいと思います。 .envファイルを2つ作る .env.developmentと.env.prodactionをプロジェクトディレクトリ直下に作ります 環境変数を定義する VITE_API_URL=http://localhost:3000/api/v1 VITE_API_URL=https://your-production-url.com ローカル環境のものをdevelopmentの方に書き 本番環境用のもの…

#Vite#プログラミング
kickflow Tech Blog•8ヶ月前

Vue Fes Japan 2024 に行ってきました

社内AIに描いてもらったVue Fes Japan 2024のイメージ図 初めまして、プロダクト開発本部の渡辺と申します。 kickflowに入社して数ヶ月が経ちました。 日々の業務で多くのことを学び、充実した毎日を送っています。 今回は「Vue Fes Japan 2024」というカンファレンスに参加したので、そのレポートをまとめようと思います。 kickflowもスポンサーとして協賛しており、当社ではフロントエンドにNuxt 3を使用しているため、今回のカンファレンスは多くの学びが得られると期待していました。

#Vue 3#Nuxt 3#Vue Fes Japan 2024#Vite