Vue、J2ee -> 001 ： Vue项目的创建过程

使用命令行的方式，通过vue-cli的脚手架进行模板下载打包：

1、安装node.js环境，查看node版本并确认是否安装成功【node -v】
2、安装WebStorm开发工具（使用WebStorm来开发Vue项目）
3、在WebStorm中直接引入Vue.js文件就可以进行开发测试
　　a、和使用eclipse进行开发无二差别
　　b、但是可以在WebStorm中可以时间查看开发情况，不用象eclips还需要启动tomcat服务器，WebStorm内存类似tomcat的服务器
4、以上只是Vue.js的简单使用，还不属于Vue项目。

5、创建Vue项目（通过脚手架下载模板项目，在模板项目基础之上进行开发）
　　a、需要node环境，上面已经安装
　　b、需要vue-cli脚手架，用于打包、测试、部署...Vue项目
　　　　安装命令【npm install -g vue-cli】，查看版本号及是否安装成功【vue -V】
　　c、Vue模板的下载，有多个模板可供下载，常用模板【webpack】
　　　　下载命令【vue init webpack 项目名称(不能有大写字母存在)】
　　　　安装过程(参数都有默认值，也可以修改)：
　　　　　　01、项目名称提示
　　　　　　02、描述
　　　　　　03、作者
　　　　　　04、是否使用vue-roter路由，如果不使用可以不安装
　　　　　　05、是否需要ESLint，一般都需要
　　　　　　06、是否需要单元测试库，如果是基于功能测试可以不需要
　　　　　　07、与06类似
　　　　　　08、使用什么方式下载，也可以手动下载
　　　　　　09、如果上面选择了手动下载会直接退出。

　　　　　　10、如果选择手动下，会直接退出花前月下给出手动下载的步骤
　　　　　　　　cd 项目名称
　　　　　　　　npm install(or if using yarn: yarn)
　　　　　　　　npm run lint -- -- fix (or for yarn: yarn rum lint -- fix)
　　　　　　　　npm run dev

　　　　　　　　上面的意思是需要进入到项目目录文件夹下进行操作
　　　　　　　　使用npm install命令进行下载，这个比较耗时
　　　　　　　　运行npm run lint -- -- fix
　　　　　　　　进行打包、并且运行【npm run dev】，完成之后会给出访问地址，在浏览器中使用给出的地址进行访问

 

以下是部分图片

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有