導入悠宇希の原文です。
作成するnpm init @vitejs/appを実行します。ここではvue-tsを選択します。 バージョン"vite": "^2.0.0-beta.48" エイリアスvite.config.ts 定数パス = require('path') エイリアス: { "@": path.resolve(__dirname, "src"), "@c": path.resolve(__dirname, "src/components") }, 環境変数の設定1. ルートディレクトリに作成する 2. VITE_ というプレフィックスが付いた変数のみが、Vite によって処理されるコードに公開されます。以下は .env.production ファイルであり、他のファイルも同様です。 3. package.jsonファイルを起動し、コマンドの後に--mode testを追加します。これはvue2と同じです。 "dev:test": "vite --mode テスト", 4. 使い方はvue2と若干異なります。vite.config.tsでは読み込めませんが、他のファイルは取得できます インポート 出力は次のようになります。 vue-router を追加します (vue3 はバージョン 4.0 以降を使用します) 1. インストール npm i [email protected] --save、バージョン4.0をインストール 2. インデックス.ts 'vue-router' から {createRouter、createWebHashHistory、RouteRecordRaw} をインポートします。 // @ts を無視 const test = () => import('../views/test1.vue') const ルート: Array<RouteRecordRaw> = [ {パス: "/", リダイレクト: "/test1"}, { パス: "/test1", 名前: 'test1', コンポーネント: テスト、 } ] const ルーター = createRouter({ 履歴: createWebHashHistory(), ルート: ルート }) デフォルトルーターをエクスポートする 3. メイン.ts 「./router」からルーターをインポートします。 アプリを作成します(アプリ) .use(ルーター) .mount('#app') vuex(バージョン4以上)を追加する1. インストール npm i vuex@index -D 2. ストア/インデックス.ts 'vuex' から {createStore} をインポートします。 エクスポートデフォルトcreateStore({ 州: { }, //... }) 3. メイン.ts './store' からストアをインポートします アプリを作成します(アプリ) .use(ストア) .mount('#app') scss環境1. npm i sass -Dをインストールすると、sass構文を直接使用できます。 css: { プリプロセッサオプション: { SCSS: { additionalData: `@import "./src/assets/scss/global.scss";` //scssファイルのパス} } }, vite2.0 設定学習の詳細説明 (typescript 版) に関するこの記事はこれで終わりです。vite2.0 設定に関するより関連性の高い内容については、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
>>: MySQL の制限使用法とページングクエリステートメントのパフォーマンス分析の詳細な説明
目次sakilaをインストールするインデックススキャンソートテーブル構造インデックススキャンをソート...
参考までに、ネイティブjsを使用して簡単な計算機(詳細なコメント付き)を実装します。具体的な内容は次...
序文:自動化を記述した後、毎日サーバー上で実行する必要があります。このような問題に遭遇しました。Je...
目次1. LAN内のプロキシ2. イントラネットの浸透イントラネット侵入とは何ですか?橋プロキシサー...
複雑なコンポーネント (クラス コンポーネント) と単純なコンポーネント (関数コンポーネント) を...
1. Workstationで仮想マシンのハードウェアバージョンを変更するWorkstation ...
よくある質問から議論を始めましょう。CSS を使用して要素の高さを [ブラウザ コンテンツ ウィンド...
Windows 10 で MySql データベースの解凍バージョンをインストールするステップ 1: ...
mptemp は安全な方法で一時ファイルまたはディレクトリを作成します。このコマンドの適用範囲: R...
1 yumでソフトウェアをインストールしたときにダウンロードしたrpmパッケージを保存しますyum ...
ステートフック例: 'react' から useState をインポートします。 関...
はじめに<br />誰もが高速インターネット接続にアクセスできるわけではありません。たと...
この記事では、入力ボックスコンポーネントを手動で実装するための具体的なコードを参考までに紹介します。...
url-loader をダウンロード 糸を追加 -D URLローダー モジュール: { ルール: {...
CSS ファイルでは、背景を使用する、つまり背景画像を追加する必要がある場合があります。これは通常、...