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. Sql Server (MSSQLSERVER) 服务无法启动

    北京的冬天特别干燥,大清早的一同事就和服务器擦出了爱的火花,结果没想到竟导致服务器无法开机了,这可尴尬了,代码可都在服务器上托管着呢,一会还等着上线呢,必须得修啊.他们说是主板坏了,就另外找了一台电脑 ...

  2. Update和Select结合统计更新

    Update和Select结合统计更新 update table_a set updatetime=getdate(), name=b.name from (select name,age from ...

  3. Appium自动化测试教程-自学网-monkey日志管理

    日志管理作用 Monkey日志管理是Monkey测试中非常重要的一个环节,通过日志管理分析,可以获取当前测试对象在测试过程中是否会发生异常,以及发生的概率,同时还可以获取对应的错误信息,帮助开发定位和 ...

  4. java 设计模式 --委派模式

    委派模式(Delegate)原理: 类B和类A是两个互相没有任何关系的类,但是B具有和A一模一样的方法和属性:并且调用B中的方法/属性就是调用A中同名的方法和属性. B好像就是一个受A授权委托的中介, ...

  5. MutationObserverAPI--微任务

    1. 作用 MutationObserverAPI可以看作一个监听DOM所有变化(包含节点.属性.文本内容的变动)的接口. 和EventTargetAPI的addEventListener相比: 共同 ...

  6. 【转】使用 Ansible 实现数据中心自动化管理

    长久以来,IT 运维在企业内部一直是个耗人耗力的事情.随着虚拟化的大量应用.私有云.容器的不断普及,数据中心内部的压力愈发增加.传统的自动化工具,往往是面向于数据中心特定的一类对象,例如操作系统.虚拟 ...

  7. 解决update-apt-xapi占用资源过高的问题

    最近云主机出现了个报错,查看系统日志发现是update-apt-xapi任务占用资源过高,甚至内存占完了无法开辟内存 云主机:Ubuntu 14.04.5 LTS update-apt-xapi是干嘛 ...

  8. 快速打造自己的PHPStorm主题

    ---恢复内容开始--- 一个优雅和舒适的界面,可以增加过多写入代码的动力. Phpstorm小型的白色主题比较简陋.为了打造一个优雅和舒适的界面,我们安装一件叫Material Theme UI的插 ...

  9. (转) hive调优(2)

    hive 调优(二)参数调优汇总 在hive调优(一) 中说了一些常见的调优,但是觉得参数涉及不多,补充如下 1.设置合理solt数 mapred.tasktracker.map.tasks.maxi ...

  10. Homebrew 使用国内镜像

    在国内的网络环境下使用 Homebrew 安装软件的过程中,可能会长时间卡在 Updating Homebrew ... 方法一:按command + c 取消本次更新操作,直接安装软件 方法二:设置 ...