吐血整理怎样使用webpack创建一个vue的空项目，以及现有项目在sublime text中打开，并运行

1.安装npm(Nodejs下的包管理器)，webpack以及vue-cli
具体流程参考这篇博客（包括下载到配置环境，全搞定，亲测，有效）
网址：https://www.cnblogs.com/goldlong/p/8027997.html
2.其实按照上面的教程，你已经成功的创建了自己的第一个vue项目，名字就是vue01。这里我再具体将创建项目部分介绍一遍
步骤：按照上面的教程，配置完环境变量path之后，我们开始创建自己的第一个vue项目
    1）检查是否安装成功：显示版本号即安装成功

  2）安装cnpm国内镜像。输入如下命令：npm install -g cnpm --registry=http://registry.npm.taobao.org 然后等待

3）安装vue-cli，输入如下命令： cnpm install -g vue-cli 等待安装（一张图放不下了）

4）创建你的第一个vue项目，首先更改路径到你想要保存项目文件的位置，这里我将文件保存在桌面上【以后创建新项目，从这一步开始就可以了】

5）输入命令：vue init webpack kuangkuang（这里kuangkuang是我的项目的名字，可以按照个人需要更改，但是不要使用大写字母）。方框中显示了参数选择，然后等待。（一张图又放不下了），然后会显示项目初始化完成了

6）这时候，我们将在桌面上（项目存放路径上）找到对应的项目文件

7）然后需要再cmd中进入文件路径，并且完成文件所需依赖。输入命令：cd desktop/kuangkuang

回车后输入命令：cnpm install 然后等待(初次安装可能内容会多一些，等待得要久一些)

8）最后就是启动项目，输入命令npm run dev 等待后会出现成功的提示，并且给了一个端口号是8080的链接。复制这个链接并在浏览器中打开。就成功啦！

9）浏览器中打开的界面如下：

10)接着我们就可以编写我们vue项目啦，这里一定要注意：cmd窗口一定不要关闭，不然就断了本地连接，还要重新打开项目，别问我是怎么知道的（网页也不要关）

11）对于第一次接触vue的我，完成到这一步的时候，我完全不知道这个页面是用来干嘛的。然后我就在这里死循环了。现在我来告诉和我一样的朋友们。现在你可以用你的sublime text打开你的这个项目文件夹了，对，就是这样拖拽一下。

12）然后你就进入到了编辑器里，如下面这个图所示。这个初始化的项目会自带一个叫App，和一个叫HelloWorld的组件，点进去这个组件的内容，就可以知道它就是上面显示的网页的代码。

13）项目文件夹中，文件的结构和用途我在这里就不介绍了。感兴趣的同学可以去看文档，或者是去慕课网上，有vue的基础课程，都会讲解。我们来手动更改一下组件的代码，然后运行一下试试。

如下图，我在父组件中，取消了子组件HelloWorld.vue的引用，同时删除了行为和样式。只在模板template中添加了一个h1标题。我们保存更改后的文件（Ctrl+s），然后再浏览器中查看第9）步骤的界面，发现自动发生了变化。

浏览器界面如下：成功修改啦。【因为之前没有经验，一直在寻找怎么运行程序，希望对大家有帮助】

最后对于现有的项目：这个项目文件已经在你的电脑上啦，所以可以按照下面三个步骤就可以直接打开啦。也就是上面的7）-9）步骤。

最后想特别感谢一下两篇博文的作者，他们详细的步骤给我省去了很多麻烦。我这篇就是对以上两篇的总结，加了一点点运行的方法。希望有用。

致谢：https://jingyan.baidu.com/article/5225f26bbb430fe6fa0908ce.html

致谢：https://www.cnblogs.com/goldlong/p/8027997.html