使用VS Code搭建Vue项目

1、安装 VScode

2、.安装最新node.JS

2.安装cnpm镜像  淘宝镜像
(node自带安装了npm,故不再安装)

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装模块时安装方法

$ cnpm install [name]

3.快速学习Vue2.0教程 
(中)http://cn.vuejs.org/ 
(英)https://vuejs.org/ 
你要是觉得这些网站访问速度都比较慢的话可以移步国内开发者自己翻译的网站:https://vuefe.cn/

4. vs 控制台 安装Vue2.0

 cnpm install vue

5.安装vue-cli 脚手架工具

 cnpm install --global vue-cli



6.在某个目录下,创建一个基于 webpack 模板的新项目

vue init webpack MyFirstVue

提示
创建webpack模板项目时,如果你对ES6和ESLint不是很熟的话我个人不建议你应用它,因为要求比较严格,所以一不小心就报错,导致整个项目运行不起来,对于初学很痛苦。 
显示如下:
 

7.安装依赖

  cnpm install 

8.运行新创建的vue项目

cnpm run dev

运行之后

Visual code 搭建Vue项目的更多相关文章

  1. 使用 vs code 搭建vue项目(一)

    1. 配置环境 1.1. 安装nodejs,下载地址:https://nodejs.org/en/download/. 步骤-..安装完成后,输入node-v,提示如下,则安装完成. 1.2. 安装v ...

  2. Mac中如何搭建Vue项目并利用VSCode开发

    (一)部署Node环境 (1)下载适合Mac环境的Node包,点击进入下载页面 (2)安装Node环境:找到下载好的Node包,这里是node-v12.14.1.pkg,我们双击它,会进入Node.j ...

  3. 手把手教你用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  4. 搭建vue项目环境

    前言 在开发本项目之前,我对vue,react,angular等框架了解,仅限于知道它们是什么框架,他们的核心是什么,但是并没有实际使用过(angular 1.0版本用过,因为太难用,所以对这类框架都 ...

  5. 快速搭建Vue项目

    快速搭建Vue项目 第一次安装vue项目Vue推荐开发环境Node.js 6.2.0.npm 3.8.9.webpack 1.13.vue-cli 2.5.1.webstrom2016 安装环境: 安 ...

  6. 利用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  7. 利用VUE-CLI脚手架搭建VUE项目

    前言 在学习完vue基础语法之后,学着利用vue-cli脚手架搭建一个项目,本篇随笔主要记录搭建的过程,供大家一起学习. 具体内容 搭建vue项目的准备工作 1.安装Nodejs.NPM以及VSCod ...

  8. element-ui和npm、webpack、vue-cli搭建Vue项目

    一.element-ui的简单使用 1.安装 1. npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 2. CDN ...

  9. vue-cli搭建vue项目更新

    vue-cli搭建vue项目更新 更新之前一篇博客错误的地方,在使用vue init webpack xxx 之后并不需要使用npm install 下载依赖包,而是直接根据提示 打开文件夹 再npm ...

随机推荐

  1. 测试工具之appcrawler的使用

    appcrawler 标签(空格分隔): appcrawler appcrawler 简介 一个基于自动遍历的app爬虫工具. 支持android和iOS, 支持真机和模拟器. 最大的特点是灵活性. ...

  2. PyCon大会Python主题演讲摘要

    PyCon 是全国际最大的以 Python 编程言语 为主题的技能大会.大会由 Python 社区组织,每年举行一次.在大会上,来自国际各地的 Python 用户与中心开发者齐聚一堂,共同同享 Pyt ...

  3. PHPWAMP集成环境配置ssl证书

    和apache配置ssl证书流程一样, LoadModule socache_shmcb_module modules/mod_socache_shmcb.so LoadModule ssl_modu ...

  4. NumPy 从数值范围创建数组

    NumPy 从数值范围创建数组 这一章节我们将学习如何从数值范围创建数组. numpy.arange numpy 包中的使用 arange 函数创建数值范围并返回 ndarray 对象,函数格式如下: ...

  5. Mybatis抛出 Closing non transactional SqlSession [org.apache.ibatis.session.defaults.DefaultSqlSession@f54509]异常

    今天在做Springmvc和spring 时 mybatis 是抛出异常 Closing non transactional SqlSession [org.apache.ibatis.session ...

  6. GIRDVIEW 控件绑定数据后 后台c#控制隐藏某列

    gv_EnterpriseInfo.DataSource = pageResult.Data; gv_EnterpriseInfo.DataBind(); 之后加判断条件: if (true) { g ...

  7. java 異常抛出 throw 與 return

    package 異常;    public class TestException {      public TestException() {      }        boolean test ...

  8. 项目总结11:Centos部署JDK+Tomcat+MySQL文档(阿里云-网易云-华为云)

      (如果不是root登陆,则输入:sudo su - 切换成root) 1.JDK安装 1-1-yum update (升级所有包同时也升级软件和系统内核) --安装中会有提示输入y就好(两个y,中 ...

  9. SPSS SAS 是什么?

    SPSS(Statistical Product and Service Solutions),“统计产品与服务解决方案”软件.最初软件全称为“社会科学统计软件包”(SolutionsStatisti ...

  10. js五种继承优缺点

    //1.原型继承 //缺点: 当父级的属性有引用类型的时候,任意一个实例修改了这个属性,其他实例都会受影响 // 1)基本类型:Number Boolean String undefined null ...