vue+element UIを利用してコンポーネントの一部を導入する方法を詳しく説明します。

前言
vue.jsのUIコンポーネントライブラリは、gitに複数のプロジェクトがあります。私が見ている利用者の多くはiViewとElementです。二つのコンポーネントライブラリは、コンポーネントが豊富です。
公式サイトの紹介

iView：Vue.jsベースの高品質UIコンポーネントライブラリ

Elementは、開発者、デザイナー、製品マネージャーのために準備されたVue 2.0ベースのコンポーネントライブラリで、セットの設計資源を提供しています。

両方とも長所と短所があります。多くのコメントをしないで、自分の需要に応じて、最後にElementを使いました。最近会社が小さいバックグラウンドプロジェクトを開発したので、一部にelementのコンポーネントを導入したいと考えています。初めて単独で導入したので、経験がないです。インターネットでたくさん見ましたが、こんな問題があります。個人的には公式サイトでも私をはっきり言わなかったと感じています。
実現方法
1、vue-cliをインストールする

npm install -g vue-cli

2、プロジェクトを作成するプロジェクトのproject Nameはあなたのプロジェクトの名前です。

npm install webpack projectName

3、プロジェクトディレクトリに入る

cd projectName

4、初期化項目のインストール依存

npm install

5、elementsuiをインストールする

npm install element-ui --save -dev

6、まずプロジェクトにstyle-loaderとbabel-plugin-componentがあるかどうかを確認します。npmがない場合

npm install xxx --save -dev

7、簡単で粗暴で、見つけます。Babelrcは元のファイルの内容を全部削除して、次のコードを貼り付けます。

 { "presets": [["env", {
     "modules": false,
     "targets": {"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]}
    }],
    "stage-2"],
  "plugins": [
     "transform-runtime",
     ["component",[
     {
     "libraryName":"element-ui",
     "styleLibraryName":"theme-default" //1.4       ，2.0  theme-chalk，                                  
     }
     ]]
     ],
  "comments":false,   
  "env": {
  "test": {
   "presets": ["env", "stage-2"],
   "plugins": ["istanbul"]
  }
  }
 }

8、webpack.base.com nf.jsに次の文を加えます。

{
 test: /\.css$/,
 loader: 'style-loader'
},

9、mian.jsに導入する

 import { Button,Input } from 'element-ui'
 Vue.use(Button)
 Vue.use(Input)

10、そしてButtonとInputが使えます。
vueはelement UIを導入しました。エラーが発生しました。
main.jsにimport'elemen-ui/lib/theme-default/index.css'を導入してエラーが発生しました。プロジェクトを起動できません。これはpackage.jsonの中のwebpackを"webpack": "beta"に変更して、再インストールすればいいです。これで起動できます。
締め括りをつける
以上はこの文章の全部の内容です。本文の内容は皆さんの学習や仕事に対して一定の参考となる学習価値を持っています。質問があれば、メッセージを書いて交流してください。ありがとうございます。