Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供:
- 通过
@vue/cli
实现的交互式的项目脚手架。 - 通过
@vue/cli
+@vue/cli-service-global
实现的零配置原型开发。 - 一个运行时依赖 (
@vue/cli-service
),该依赖:- 可升级;
- 基于 webpack 构建,并带有合理的默认配置;
- 可以通过项目内的配置文件进行配置;
- 可以通过插件进行扩展。
- 一个丰富的官方插件集合,集成了前端生态中最好的工具。
- 一套完全图形化的创建和管理 Vue.js 项目的用户界面。
- 单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。
- 在vue的spa中,需要编写vue文件。
- Vue提供单文件组件(扩展名为 .vue的文件),每一个vue文件由3部分组成:
- 模板(html代码):
- 脚本(js代码):
- 步骤2:在路由定义Test.vue路径
{ path: '/test', name: 'testName', // route level code-splitting // this generates a separate chunk (about.[hash].js) for this route // which is lazy-loaded when the route is visited. component: () => import(/* webpackChunkName: "about" */ '../views/Test.vue') }
文章图片
步骤3:在App.vue编写Test.vue访问路径
测试页面
文章图片
步骤4:访问Test.vue
文章图片
常见问题- 创建vue项目时,提示禁用的脚本
文章图片
- 需要操作:
文章图片
1.运行命令set-ExecutionPolicy RemoteSigned
2.输入 Y 回车
文章图片
看了vue cli的安装方式总结一下。如有不多请多多指教!希望给您带来帮助!
【Vue.js入门到精通|最新【vue】使用vue-cli5.0快速搭建一个项目】vue-cli参考文档:介绍 | Vue CLI? Vue.js 开发的标准工具
文章图片
https://cli.vuejs.org/zh/guide/
推荐阅读
- Java毕业设计项目实战篇|Java项目:在线点餐系统(java+Springboot+Maven+mybatis+Vue+mysql+Redis)
- 实用工具|Mockjs模拟接口实现增删改查、分页、多条件查询
- Vue双向绑定原理及实现|Vue双向绑定原理及实现
- Vue|vue-property-decorator用法详解
- vue.js|has no exported member
- vue watch监听触发防抖节流
- spring|Vue-admin-template+SpringBoot+MyBatisPlus实现图书的增删改查功能
- 前端VUE|Vue用户管理(增删改查)功能详情
- JavaSE|Day3.变量、常量、运算符、package及JavaDoc