搭建VUE项目的准备(利用vue-cli来构建项目)
1.安装node.js,检测版本node -v,还要检测包管理工具npm -v
2. 安装webpack,打开命令行工具输入:npm install webpack -g,安装完成之后输入 webpack -v,如下图,如果出现相应的版本号,则说明安装成功。
.png)
//全局安装
npm install -g webpack

3. 安装vue-cli脚手架构建工具
npm install vue-cli -g
安装vue-cli脚手架构建工具,打开命令行工具输入:npm install vue-cli -g,安装完成之后输入 vue -V(注意这里是大写的“V”),如下图,如果出现相应的版本号,则说明安装成功

在准备阶段

接下来我们就准备构建项目了,首先就是找个磁盘,自己新建一个文件用于放我们的项目
在命令行中 cd 找到我们的项目文件
vue init webpack 项目名字<项目名字不能用中文>
然后会显示

Target directory exists. Continue? (Y/n) 直接回车默认(然后会下载 vue2.0模板,这里可能需要连代理)
Project name (vue-test) 直接回车默认
Project description (A Vue.js project) 直接回车默认
Author 直接回车默认
Use ESLint to lint your code? n
pick an eslint preset. 默认Standard
setup unit tests with karma + mocha?No(单元测试不需要)
setup e2e tests with Nightwatch?No(单元测试不需要)
到了这里,说明你的项目就可以正式运行了,打开浏览器输入上述的链接,项目搭建完毕,可以开发了

搭建VUE项目的准备(利用vue-cli来构建项目)的更多相关文章
- 基于@vue/cli 的构建项目(3.0)
1.检测node的版本号 注意:1.Vue CLI需要Node.js的版本 8.9+(推荐8.11.0+) 所以在安装Vue CLI之前先看下node的版本 node -v 2.安装@vue/cli ...
- 项目管理01--使用Maven构建项目(纯干货)
目录 1. Maven基础知识 2. Maven实战.开发.测试.打包.部署一个Web项目 一.Maven基础知识 Maven坐标 Maven提供了一个中央仓库,里面包含了大量的开源软件的jar包,只 ...
- Jhipster 学习(一)jhipster构建项目
如何安装jhipster 第一步:下载jdk 自己安装的1.8版本 (安装.环境变量配置略) 第二步:1.下载Eclipse (luna版 eclipse-4.4.1) 第三步:下载maven ( ...
- CMake 构建项目教程-简介
CMake 构建项目教程-简介 Linux 平台构建项目,选择了CLion作为C++的IDE,而CLion默认就是使用CMake构建项目,所以这里记录了CMake在构建项目过程的一些小知识. 1. 项 ...
- vue.js2.0:如何搭建开发环境及构建项目
1,安装node.js Node.js官网:https://nodejs.org/en/ 进入Node.js官网,选择下载并安装Node.js.安装过程只需要点击“下一步”即可, 如下图,非常简单. ...
- [Vue 牛刀小试]:第十七章 - 优化 Vue CLI 3 构建的前端项目模板(1)- 基础项目模板介绍
一.前言 在上一章中,我们开始通过 Vue CLI 去搭建属于自己的前端 Vue 项目模板,就像我们 .NET 程序员在使用 asp.net core 时一样,我们更多的会在框架基础上按照自己的开发习 ...
- Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四)
Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四) 前言 本章主要讲解通过Vue CLI 脚手架构建工具创建一个项目,在学习Vue CLI之前我们需要先了解下webpa ...
- Vue框架(三)——Vue项目搭建和项目目录介绍、组件、路由
Vue项目环境搭建 1) 安装node,在官网下载好,然后在本地安装 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm ins ...
- VUE学习笔记之vue cli 构建项目
一.环境搭建: 1.安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd), ...
随机推荐
- python基础7之python3的内置函数
官方介绍: python3:https://docs.python.org/3/library/functions.html?highlight=built#ascii python2:https:/ ...
- socket编程--相关函数--sendto();read();
{1} 头文件:#include <sys/types.h> #include <sys/socket.h>定义函数:int sendto(int s, const voi ...
- 第二章 在HTML中使用JS
script 标签 属性 src : 可选 包含要执行的外部文件 type : 表示编写代码使用的脚本语言的内容类型(MINI类型) text/javascript async: 可选 只对外部脚 ...
- scss 初学笔记 二 混合宏
混合宏 格式 @mixin 定义混合宏 (相当于变量声明 var $ ?) //不带参数混合宏 @mixin borderRadius{ -webkit-border-radius: 5px; b ...
- 8_python连接数据库
如何用python操作数据库? -- 导入pymysql -- import pymysql -- 创建连接 - ...
- java精确运算
public class ArithUtil { /** * 加法 * @param * @return double * @throws Exception * @author zhangyn * ...
- java中String的.trim()方法
该方法去除两边的空白符 原理: 看看源码实现 public String trim() { int len = value.length; ; char[] val = value; /* avoid ...
- 输入和输出--RandomAccessFile类
RandomAccessFile 类 RandomAccessFile 类既可以读取文件内容,也可以向文件输出数据. RandomAccessFile 类支持 "随机访问" 的方式 ...
- Asp.net mvc 中View 的呈现(二)
[toc] 上一节介绍了 Asp.net mvc 中除 ViewResult 外的所有的 ActionResult,这一节介绍 ViewResult. ViewResultBase ViewResul ...
- the first simple html page generated by div and table tags
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w ...