Vue学习篇(一)：搭建环境+创建项目

从git上导入项目后，已经开始写vue的界面了，今天用webstrom新建工程才发现还需要配置vue-cli or @vue-cli。

这篇主要讲下webstrom相关配置。

1：配置webpack

     打开命令行，输入npm install webpack -g ，全局安装webpack。

     成功后检测下，继续输入 webpack -v

    第一次输入会出现Do you want to install 'webpack-cli' (yes/no):

    输入y即可。

   

2：安装vue-cli    

     输入命令行：npm install --global vue-cli

   检验是否成功：vue -V.

  注意这里v是大写，不能是小写。

  

根据上述路径查看文件目录：

这里不需要再配置什么，vue-cli是全局的，webstrom会自动识别路径。

 三：创建项目

    新建工程，选择vue.js.

     file->new->project>vue.js

    

   可以看到vue-cli这一行已经自动识别的路径，并填充。

  改下工程名字，next，注意这里项目名称不能包含大写字母。

  接着下一步：

 接着填写author等信息完成创建。

工程目录如下：

 

运行项目：

 

打开chrome，访问：