Vue:Vue-Cli 实现的交互式的项目脚手架
一、这份文档是对应 @vue/cli。老版本的 vue-cli 文档请移步https://github.com/vuejs/vue-cli/tree/v2#vue-cli--
Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供:
- 通过
@vue/cli实现的交互式的项目脚手架。 - 通过
@vue/cli+@vue/cli-service-global实现的零配置原型开发。 - 一个运行时依赖 (
@vue/cli-service),该依赖:- 可升级;
- 基于 webpack 构建,并带有合理的默认配置;
- 可以通过项目内的配置文件进行配置;
- 可以通过插件进行扩展。
- 一个丰富的官方插件集合,集成了前端生态中最好的工具。
- 一套完全图形化的创建和管理 Vue.js 项目的用户界面。
- 通过
Vue CLI 致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接,这样你可以专注在撰写应用上,而不必花好几天去纠结配置的问题。与此同时,它也为每个工具提供了调整配置的灵活性,无需 eject。
二、vue-cli的安装
步骤一:npm install -g @vue/cli-init; (-g表示全局安装)------vue-list 查看可用的模板
步骤二:选择好vue项目所在的路径,建好工程文件夹,比如:my-vue,cd my-vue到此目录路径下
执行 vue init webpack firstApp; (init 初始化的意思,firstApp为此项目命名的文件夹名称)

步骤三:npm install; 此过程为“安装项目依赖”:即安装项目所依赖的node 包。(安装后,会在上图中多出一个node_modules文件夹。)
步骤四:npm run dev;(然后浏览器打入http://localhost:8080)

原文转至:https://blog.csdn.net/elie_yang/article/details/80042035
Vue:Vue-Cli 实现的交互式的项目脚手架的更多相关文章
- 从零开始制作cli工具,快速创建项目脚手架
背景 在工作过程中,我们常常会从一个项目工程复制代码到一个新的项目,改项目配置信息.删除不必要的代码. 这样做的效率比较低,也挺繁琐,更不易于分享协作. 所以,我们可以制作一个cli工具,用来快速创建 ...
- vue之cli脚手架安装和webpack-simple模板项目生成
ue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. GitHub地址是:https://github.com/vuejs/vue-cli 一.安 ...
- @vue/cli 3.x项目脚手架 webpack 配置
@vue/cli 是一个基于 Vue.js 进行快速开发的完整系统. @vue/cli 基于node服务 需要8.9以上版本 可以使用 nvm等工具来控制node版本 构建于 webpack ...
- vue之cli脚手架项目中组件的使用
在webpack-simple模板中,包括webpck模板.一个.vue文件就是一个组件. 为什么会这样呢?因为webpack干活了!webpack的将我们所有的资源文件进行打包.同时webpack还 ...
- 简单vue项目脚手架(vue+webpack2.0+vuex+vue-router)
github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...
- vue环境搭建以及使用vue-cli创建项目
我要跑vue项目,所以我要搞vue. 1.环境搭建 进入node官网下载对应版本的node,一步步安装即可. 安装会自动配置路径和npm包管理环境,通过node -v进行验证 2.安装vue-cli脚 ...
- 简单vue项目脚手架
简单vue项目脚手架 github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-ro ...
- Vue.js – 基于 MVVM 实现交互式的 Web 界面
Vue.js 是用于构建交互式的 Web 界面的库.它提供了 MVVM 数据绑定和一个可组合的组件系统,具有简单.灵活的 API.从技术上讲, Vue.js 集中在 MVVM 模式上的视图模型层,并 ...
- Vue入坑教程(二)——项目结构详情介绍
之前已经介绍了关于Vue的脚手架vue-cli的安装,以及一些文件目录介绍.具体可以查看<vue 入坑教程(一)--搭建vue-cli脚手架> 下面简单说一下具体的文件介绍 (一) pac ...
随机推荐
- 09vuex
state 大白话:获取state的值 vuex中state数据是响应式的.只要state中数据发生变化.vue组件自动更新. 要想做到响应式 前提:是在mutaion中定义函数修改state值. 最 ...
- Thymeleaf中model设一个值 页面显示此值 JS取此值
model设值: m.addAttribute("pageNo", pageNo); 页面显示值: 当前为第:<span th:text="${pageNo}&qu ...
- axure rp extension for chrome怎么用
1)打开文件(原型图)的resources文件夹>chrome文件夹>将文件axure-chrome-extension.crx拉至谷歌浏览器的扩展程序页面,点击确定添加 2)提示出错时, ...
- [Oracle/SQL]找出id为0的科目考试成绩及格的学生名单的四种等效SQL语句
本文是受网文 <一次非常有意思的SQL优化经历:从30248.271s到0.001s>启发而产生的. 网文没讲创建表的数据过程,我帮他给出. 创建科目表及数据: CREATE TABLE ...
- IDEA项目左侧目录看不到target
点击如下图所示图标,然后选择Show Excluded Files后即可出现
- linux下查找文件中的某个关键字
1.方法一:grep '关键字' filename 2.方法二:vim filename进入文件里面,不要进入insert编辑模式,直接在normal模式下输入/关键字进行搜索 按n进行查找下一个
- Hadoop入门学习整理(二)
2020-04-15 在上一篇文章中介绍了Linux虚拟机的安装,Hadoop的安装和配置,这里接着上一篇的内容,讲Hadoop的简要介绍和简单使用, 以及HBase的安装和配置. 1.首先要了解Ha ...
- 原来写插件还可以选MEF
MEF是微软提供的一个轻量级的ICO容器,可以轻易的解除程序集的依赖关系,最近想写个类似插件试的软件所以搜索了一下,终于淘到宝了. 下面我们看看MEF是如何解耦的 新建一个控制台项目两个类库 Ites ...
- 快速排序之C实现和JS实现的区别
快速排序是面试中的几乎必问的问题,理解之后发现并不难,在此贴出两种版本,与小伙伴们相互交流 PS:今天码代码非常有感觉,所以连发三篇博客,下午打球,手感也是热的发烫,希望不忘初心,方得始终. 进入正题 ...
- nginx upstream一致性哈希的实现
地址:http://wiki.nginx.org/HttpUpstreamConsistentHash 首先声明一个命令: static ngx_command_t ngx_http_upstrea ...