手动搭建一个vue项目

一、创建一个空的文件夹app

npm init命令帮助我们快速初始化 package.json 文件

pakege.json定义了这个项目所需要的各种模块:

        name和version定义项目的名称和项目的版本号；dependencies属性指定了项目运行所依赖的模块；license属性是表述你项目发布遵循什么样的规则，用户拥有那些权限；author 属性指明了项目的发布者；scripts指定了运行脚本命令的npm命令行缩写

二、执行npm i –save vue安装vue

生成node_modules文件夹和package-lock.json文件

        node_modules是安装node后用来存放用包管理工具下载安装的包的文件夹。比如webpack、gulp、grunt这些工具。在node.js中模块与文件是一一对应的，也就是说一个node.js文件就是一个模块。为了不让项目依赖环境，也不污染环境，每个项目文件夹下都有一个node_modules。

        package-lock.json 的作用是锁定依赖安装结构，如果查看这个 json 的结构，会发现与 node_modules 目录的文件层级结构是一一对应的。记录了 nodemodules 里所有包的结构、层级和版本号甚至安装源，它也就事实上提供了 “保存” nodemodules 状态的能力。只要有这样一个 lock 文件，不管在那一台机器上执行 npm install 都会得到完全相同的 node_modules 结果。

三、执行npm i—save-dev 安装webpack

        生成webpack工具到 node_modules中。

四、在app根目录，创建src文件夹，src文件夹里面创建main.js和App.vue。根目录创建webpack