怎样使用 vue-cli ( Vue 脚手架 )
vue-cli 是 Vue 官方出品的快速构建单页应用的脚手架, 相当于 React 官方出品的 create-react-app , 下面演示 vue-cli 的 最 基本用法:
1. 全局安装 vue-cli, 这里使用 cnpm 进行安装, 没有安装 cnpm 可是看: 这里
- $ cnpm install -g vue-cli
2. 安装后, 我们使用下面的命令初始化一个 vue 项目, 执行期间一律按 回车
- $ vue init webpack my-project
如果没有安装 webpack, 可以使用 cnpm 进行安装
3. 完成后, 按照命令行里的提示, 我们需要切到 ./my-project 目录下, 然后加载依赖包: cnpm install
- $ cd ./my-project
- $ cnpm install
注意, 这里使用 npm install 也是可以的, 但会很慢, 所以建议使用 cnpm
4. 运行 cnpm run dev 启动项目, 出现下面指示时, 表示已经启动成功.
- $ cnpm run dev
5. 打开浏览器, 输入 localhost:8080 即可查看已启动的项目
怎样使用 vue-cli ( Vue 脚手架 )的更多相关文章
- vue cli & vue 3.x
vue cli & vue 3.x https://cli.vuejs.org/dev-guide/ui-api.html#ui-api https://cli.vuejs.org/zh/gu ...
- vue cli创建脚手架
1.用vscode打开一个文件夹.在菜单栏 点击 查看-集成终端.这里可以用其他的方法比如cmd命令符调开这个界面,但是要用cd 切到要放文件的文件夹下. 2.安装好node.js 和淘宝镜像 3. ...
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- Vue CLI 3+tinymce 5富文本编辑器整合
基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/ ...
- vue cli 3
介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...
- Vue Cli安装以及使用
因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...
- vue学习笔记——脚手架安装
项目启动:npm run build 脚手架 vue cli vue cli --2 安装命令 #全局安装 npm install --global vue-cli #卸载vue-cli npm u ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
- 【vue】---- 新版脚手架搭建项目流程详解
一.概述 本文将介绍vue项目完整的搭建流程,在使用新版本的脚手架基础上,进行了一系列的完善和配置.主要内容如下: 1.项目初始化 安装脚手架 创建项目 项目结构 2.项目搭建配置 引入第三方插件 路 ...
- Vue CLI 是如何实现的 -- 终端命令行工具篇
Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供了终端命令行工具.零配置脚手架.插件体系.图形化管理界面等.本文暂且只分析项目初始化部分,也就是终端命令行工具的实现. 0. 用法 ...
随机推荐
- Leetcode题目56.合并区间(中等)
题目描述: 给出一个区间的集合,请合并所有重叠的区间. 示例 1: 输入: [[1,3],[2,6],[8,10],[15,18]] 输出: [[1,6],[8,10],[15,18]] 解释: 区间 ...
- cv常用名词缩写
lr:learning rate roi:region of interest,可能包含目标的区域. wd:weight decay fps:frame per second,每秒几帧 fine tu ...
- Nginx-HTTP之静态网页访问流程分析一
假设访问静态网页的配置如下: worker_processes 1; error_log stderr debug; daemon off; master_process on; events { w ...
- Filebeat使用
1.Beat家族 Beats可以直接(或者通过Logstash)将数据发送到Elasticsearch,在那里你可以进一步处理和增强数据,然后在Kibana中将其可视化. 2.FileBeat安装 2 ...
- 【互联网运营P1】
一.导论 [运营]是什么 二.运营的职业分工和职能发展 三.转化型文案 4个高转化率短文案的常见姿势 2个短文案写作的核心要则 中长型转化文案的写作 针对所有问题点依次进行详细解读 四.第三方推广 常 ...
- 中间件 | kafka简介、使用场景、设计原理、主要配置及集群搭建
开源Java学习 公众号 一.入门 1.简介 Kafka is a distributed,partitioned,replicated commit logservice.它提供了类似于JMS的特性 ...
- LC 241. Different Ways to Add Parentheses
Given a string of numbers and operators, return all possible results from computing all the differen ...
- LC 975. Odd Even Jump
You are given an integer array A. From some starting index, you can make a series of jumps. The (1 ...
- [Spark] Spark 3.0 Accelerator Aware Scheduling - GPU
Ref: Spark3.0 preview预览版尝试GPU调用(本地模式不支持GPU) 预览版本:https://archive.apache.org/dist/spark/spark-3.0.0-p ...
- HBase管理与监控——彻底删除HBase数据
1.hadoop的bin目录下,执行命令以下命令清除Hbase数据 hadoop fs -rm -r /hbase 2.连接ZK,执行以下命令清除Hbase数据 rmr /hbase 3.重启ZK.重 ...