VUE-CLIは公式出版物vue.jsプロジェクトの足場は、迅速VUEプロジェクトを作成することができVUE-CLIを使用して、あります。この記事では、実際の運用の観点からも、建物全体のプロセスをご紹介します。
1.はじめにピットを避けます
実際には、VUE-CLIプロセスを使用して、この時間が成功しなかった、この出会い以下のエラーを再び数回試してみてください。
VUE-CLIプロジェクトを作成するときにエラー
インターネットは、この「低」の公式説明は、問題が発見されていないが、私が低すぎるの問題のそのノードのバージョンを実現し、多くの情報を検索しますが、外国人の友人によると、あなたは少なくともnode6を使用する必要があり、私はノード4が更新される経験則node8後、本当にスムーズなセットアップに与えられていません。関連記事Q＆A：https://github.com/vuejs/vue-cli/issues/618
確認し、そのノードとのバージョンNPM
私たちはビルドに願っています前に、このアップフロントを言うだろう、上記ノード6を更新することを確認する必要があり、これはいくつかの回り道を取ることができます。ここでは、正式には、ビルドプロセス全体で導入し始めました。
2.使用VUE-cliの建築プロジェクト
ここでは、全体のプロセスは、すでにのNode.jsとcnpmにインストールされている基礎に基づいており、言うためにここにいないインストールする方法の詳細をNode.jsの。どのようにここでは、cnpmインストール簡単なの言及をグローバル化する方法：
npm install cnpm -g --registry=https://registry.npm.taobao.org
実際には、インストールVUE-cliのために、NPMコマンドとcnpmコマンドを使用して可能であり、個人的にNPMの使用は、よりゆっくりインストールすることを感じ、おそらくネットワークの問題やミスによるものですが、私はまだ少し使用cnpmの安定を感じます。
（1）グローバルインストールVUE-CLIは、実行するコマンドプロンプトウィンドウ：
cnpm install -g vue-cli
インストールVUE-CLI
上記のプロンプトが表示されますが正しくインストールさVUE-CLIを表し、あなたは正式なVUE-cliのエンジニアリング・プロジェクトを作成することができます。
あなたは、コマンドプロンプトウィンドウでプロジェクトを配置するフォルダにcd（2）インストールVUE-cliの成功、VUE-CLIプロジェクトを作成するためのコマンドを実行します。
vue init webpack
VUE-CLIプロジェクトの作成
彼らはESLint仕様コードなどを使用する場合、プロジェクト、フォローアッププロジェクト名、プロジェクトの説明、作者、パッケージを入力する必要性についてを作成して確認した後、マップを参照してください。次のようにインストールが正常に実装した後のファイルのディレクトリを生成します。
ファイルディレクトリを生成します
（3）インストールに依存するcnpmを使用して、ファイルのディレクトリを生成します：
cnpm install
インストールが依存します
（4）最后需要执行命令： npm run dev 来启动项目，启动完成后会自动弹出默认网页：
启动项目
启动项目
默认网页
到这一步，就算成功利用vue-cli搭建一个vue项目了，撒花 ~
3.目录结构及其对应作用
通过vue-cli搭建一个vue项目，会自动生成一系列文件，而这些文件具体是怎样的结构、文件对应起什么作用，可以看看下面的解释：
├── build/ # webpack 编译任务配置文件: 开发环境与生产环境
│ └── ...
├── config/
│ ├── index.js # 项目核心配置
│ └── ...
├ ── node_module/ #项目中安装的依赖模块
── src/
│ ├── main.js # 程序入口文件
│ ├── App.vue # 程序入口vue组件
│ ├── components/ # 组件
│ │ └── ...
│ └── assets/ # 资源文件夹，一般放一些静态资源文件
│ └── ...
├── static/ # 纯静态资源 (直接拷贝到dist/static/里面)
├── test/
│ └── unit/ # 单元测试
│ │ ├── specs/ # 测试规范
│ │ ├── index.js # 测试入口文件
│ │ └── karma.conf.js # 测试运行配置文件
│ └── e2e/ # 端到端测试
│ │ ├── specs/ # 测试规范
│ │ ├── custom-assertions/ # 端到端测试自定义断言
│ │ ├── runner.js # 运行测试的脚本
│ │ └── nightwatch.conf.js # 运行测试的配置文件
├── .babelrc # babel 配置文件
├── .editorconfig # 编辑配置文件
├── .gitignore # 用来过滤一些版本控制的文件，比如node_modules文件夹
├── index.html # index.html 入口模板文件
└── package.json # 项目文件，记载着一些命令和依赖还有简要的项目描述信息
└── README.md #介绍自己这个项目的，可参照github上star多的项目。
build/