vue2: VueCli に基づいて ElementUI の基本プロジェクト環境を構築する

ElementUI はどのような Web サイトに適していますか?
バックグラウンド管理Webサイト

1. 新しい VueCli プロジェクトを作成します。要素プロジェクト。(Vue 2.x 用のプロジェクト)

足場を設置する

npm install -g @vue/cli 

npm タオバオ ソースを設定してダウンロード速度を高速化する

npm config set registry https://registry.npm.taobao.org

クリーンなディレクトリを見つける

vue create element-project 等一会
Manually select features
选择:Babel - Router - Css Preprocessors 去掉linter
2.x
以下选项一路回车即可

2. コマンドを実行して、ElementUI コンポーネント ライブラリをインストールします。

プロジェクトディレクトリに入り、インストールコマンドを実行します。

cd element-project
npm i element-ui -S

element-ui コンポーネント ライブラリのソース コードをウェアハウスからダウンロードし、node_modules に配置します。-S オプションは、この依存関係を
package.json 構成ファイルに追加します。

3. main.js に ElementUI のすべての要素とスタイルを導入します。

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
// use()方法可以将ElementUI中的所有组件全部引入当前Vue项目
// 一旦在此处引入,每一个组件都将可以使用ElementUI的组件
Vue.use(ElementUI);

4. ElementUI コンポーネントを使用します。

<template>
<div>
<el-button>默认按钮</el-button>
</div>
</template>

おすすめ

転載: blog.csdn.net/qq_51463650/article/details/129998912