1.第一步：安装vue-cli

命令行输入cmd或按住shift鼠标右键打开powershell

输入命令

npm install --global vue-cli 按enter键

2.第二步：创建项目

在要创建项目的目录下输入以下命令

vue init webpack projectName（其中projectName为要创建的项目名称）

按下enter键

然后终端会出现下图“一问一答”模式，如图：

这里有几个需要说明一下，没说明的直接回车选择默认

“Project name”：这个是项目名称，默认是输入时的那个名称，想改的话直接输入修改，也可以直接回车

“Install vue-router”:是否需要vue-router，这里默认选择使用，这样生成好的项目就会有相关的路由配置文件

“Use ESLint to lint your code”:是否使用ESLint，刚才说了我们这个项目需要使用所以也是直接回车，默认使用，这样会生成相关的ESLint配置

“Setup unit tests with Karma + Moch?”: 是否安装单元测试。我们现在还没有单元测试

“Setup e2e tests with Nightwatch”：是否安装e2e测试，这里我也同样选择的是“N”。

最后会提示选择管理工具，选择npm或yarn都可以，两者的指令有所不同，这里就选择npm

初始化完成后按照提示进入项目目录，输入 npm run dev启动项目

vue-cli2.0项目的搭建的更多相关文章

  1. Vue cli2.0 项目中使用Monaco Editor编辑器

    monaco-editor 是微软出的一条开源web在线编辑器支持多种语言,代码高亮,代码提示等功能,与Visual Studio Code 功能几乎相同. 在项目中可能会用带代码编辑功能,或者展示代 ...

  2. vue.js2.0实战(1):搭建开发环境及构建项目

    Vue.js学习系列: vue.js2.0实战(1):搭建开发环境及构建项目 https://my.oschina.net/brillantzhao/blog/1541638 vue.js2.0实战( ...

  3. vue/cli2.0优化

    vue/cli2.0 脚手架 在项目写完了之后, 运行npm run build --report可以看出这个项目的资源占比情况.可以看出整个项目哪一个资源在整个项目占比最大.它会自动打开一个可视化的 ...

  4. Vue3.0项目快速搭建

    安装安装vue-cli npm install -g @vue/cli # 或者 yarn global add @vue/cli 创建项目 vue create hello-world 至此项目搭建 ...

  5. vue 3.0 项目搭建移动端 (七) 安装Vant

    # 通过 npm 安装 npm i vant -S 安装完配置 babel.config.js module.exports = { presets: ['@vue/app'], plugins: [ ...

  6. vue 3.0 项目搭建移动端 (六) 命名路由同级控制

    const Tabbar = () => import('@/components/Tabbar'); export default [ { path: '/', name: 'home', c ...

  7. 3 webpack 4 加vue 2.0生产环境搭建

    1 在前两篇笔记中已经能把开发环境弄好了,接来下构建他的生产环境 2 使用npm 安装url-loader和file-loader来支持图片和字体 npm install --save-dev url ...

  8. Vue 2.0 项目在IE下显示空白

    新写的项目在 IE浏览器显示空白 解释一: Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator.Generator.Set.Maps.Proxy ...

  9. vue 3.0 体验，vue 3.0新特性

    前言 昨天不是尤雨溪 不是刚在B站 直播玩了,分享了vue-next v3.0.0-beta.1 版本 哈哈, 不要太刺激哦 6大亮点 Performance:性能更比Vue 2.0强. Tree s ...

随机推荐

  1. vue生命周期在工作中的用法

    1.首先来官方服生命=周期的解释: beforeCreate():实例在内存中被创建出来,还没有初始化好data和methods属性. create():实例已经在内存中创建,已经初始化好data和m ...

  2. spark的广播变量

    直接上代码:包含了,map,filter,persist,mapPartitions等函数 String master = "spark://192.168.2.279:7077" ...

  3. sql server 很好的基础练习 <学生表-老师表-课程表-选课表>

    表结构 --学生表tblStudent(编号StuId.姓名StuName.年龄StuAge.性别StuSex) --课程表tblCourse(课程编号CourseId.课程名称CourseName. ...

  4. MongoDB 副本集主从切换方法

    一.方法一rs.setpDown() 将Primary节点降级为Secondary节点 myapp:PRIMARY> rs.stepDown() 这个命令会让primary降级为Secondar ...

  5. Linux core dump 诊断进程奔溃退出

           最近项目中出现了一个问题,服务器端程序会突然崩溃退出,我们采取了coredump技术以找到崩溃原因,即确定进程退出时正在执行的函数是哪个,其状态如何.       如果系统开启了core ...

  6. 【原创】go语言学习（九）指针类型

    目录 变量和内存地址 指针类型 值拷贝和引用拷贝 变量和内存地址 1.每个变量都有内存地址,可以说通过变量来操作对应大小的内存 var a int32 a = 100 fmt.Printf(“%d\n ...

  7. scala 递归读取文件夹下所有的指定后缀的文件

    def getFile(file:File): Array[File] ={ val files = file.listFiles().filter(! _.isDirectory) .filter( ...

  8. C# 下划线转驼峰

    /// <summary> /// 转换 /// </summary> /// <param name="sender"></param& ...

  9. NOIP2018普及组初赛解题报告

    本蒟蒻参加了今年的NOIP2018普及组的初赛 感觉要凉 总而言之,今年的题要说完全没有难度倒也不至于,还有不少拼RP的题,比如第一次问题求解考逻辑推理,第一次完善程序考双链表等 下面我就和大家一起看 ...

  10. 深入理解JVM虚拟机6：深入理解JVM类加载机制

    深入理解JVM类加载机制 简述:虚拟机把描述类的数据从class文件加载到内存,并对数据进行校验.转换解析和初始化,最终形成可以被虚拟机直接使用的Java类型,这就是虚拟机的类加载机制. 下面我们具体 ...