このドキュメントはビデオ チュートリアルに関連付けられています。サイトで同じ名前のブロガーを検索します。 b.
1. 構造
-
node_modules の依存関係
-
パブリックパブリックディレクトリ
- favicon.ico Web ページのアイコン
- Index.html vue プロジェクトには HTML が 1 つだけ (つまり、ページが 1 つだけ [単一ページ]) あり、すべてのルーティング ページはそれを介してブラウザーに表示されます。
-
src 内部リソース コード ディレクトリ
- アセットの静的リソース (写真や CSS ファイルなど)
- コンポーネントコンポーネントディレクトリ
- ルータルーティング
- グローバル変数を保存する
- ビューページ
- App.vue vue ルート ページ (vue エントリ ページ、グローバル ページ)
- main.js vue 入口 js、vue の始まり
-
babel.config.js はブラウザのバージョン構成を組み合わせるために使用されます
-
package.json プロジェクト名、バージョン、実行コマンド、依存関係、デュアルユースなどのプロジェクトの説明。
-
package-lock.json 依存関係の範囲を決定し、詳細を確認する
-
README.md プロジェクト MD の説明 (github へのアップロードなど)。この説明はデフォルトで表示されます。
2. インスタンスファイルを削除する
- App.vueを次のように変更します
<template>
<div id="app">
<router-view />
</div>
</template>
<style lang="scss">
</style>
- コンポーネント
HelloWorld.vueを削除する - ルーターのindex.jsを次のように変更します。
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = []
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router
- ビューの下の 2 つの vue ファイルを削除します。
- アセット内の logo.png を削除します
3. 要素のインストール
https://element.eleme.cn/#/zh-CN/component/installation を開き、コマンドをコピーします。
npm i element-ui -S
インストールが完了すると、element-ui は package.json の依存関係の下に表示されます。それ以外の場合はインストールされません。