1、安装node js

  下载地址:http://nodejs.cn/download/
2、安装完成后运行Node.js command promptnode -v查看安装版本)

  
3、安装npm(由于现在版本的nodejs已经集成npm所以无需安装,可以用npm -v 查看版本)

  
4、注册cnpm来代替npm
  使用命令:npm install cnpm -g --registry=https://registry.npm.taobao.org

  如果你发现你安装成功了,使用cnpm却发现找不到命令,那么就是你的环境变量有问题,在环境变量里面的path添加你node的安装路径就行,比如";C:\Program Files\nodejs\node_modules"

5、安装vue脚手架vue-cli
  命令:cnpm install -g vue-cli

  安装成功后可以用 vue -V 查看vue版本
6、cd到对应的目录下初始化vue项目
  命令:vue init webpack my-project
      Project name 项目名 
      Project description 项目名描述 
      Author 作者邮箱 
      Use ESLint to lint your code? 是否需要ESlist语法检查 
      Setup unit tests with Karma + Mocha? 是否需要单元测试 
      Setup e2e tests with Nightwatch? Yes是否需要e2e测试 
7、package.json为项目依赖资源,如果要运行这个项目需要使用cnpm install 安装依赖项(直接在项目文件夹路径下执行)
8、使用命令cnpm run dev启动项目,浏览器会打开 http://localhost:8080/#/ 看到以下效果

  开发时属于热部署状态,代码保存后浏览器会自动刷新,错误提示也非常友好。

9、编译打包 cnpm run build

  会编译打包到项目dist文件夹下,然后我们就可以部署到服务器上(注意:如果你直接打开index.html,可能页面会是一片空白,这是由于你引用的js路径有问题)

10、使用jQuery包

  转自:http://www.cnblogs.com/pandabunny/p/5417938.html

从安装node js到构建一个vue并启动它的更多相关文章

  1. Vue.js:安装node js到构建一个vue并启动它

    ylbtech-Vue.js:从安装node js到构建一个vue并启动它 1.返回顶部 1. 1.安装node js 下载地址:http://nodejs.cn/download/2.安装完成后运行 ...

  2. 安装node.js、webpack、vue 和vue-cli 以及安装速度慢/不成功的解决方法

    1.安装node.js 地址:https://nodejs.org/en/  下载安装软件之后,点击下一步即可 打开dos窗口,输入cmd能快速打开,输入npm -v 和 node -v 能显示出版本 ...

  3. Windows10安装node.js,vue.js以及创建第一个vue.js项目

    [工具官网] Node.js : http://nodejs.cn/ 淘宝NPM: https://npm.taobao.org/ 一.安装环境 1.本机系统:Windows 10 Pro(64位)2 ...

  4. 构建微服务开发环境5————安装Node.js

    [内容指引] 下载Node.js: Mac下安装Node.js: Windows下安装Node.js; 查看node和npm的版本. 一.下载Node.js 访问Node.js官网:https://n ...

  5. 基于 Egg.js 框架的 Node.js 服务构建之用户管理设计

    前言 近来公司需要构建一套 EMM(Enterprise Mobility Management)的管理平台,就这种面向企业的应用管理本身需要考虑的需求是十分复杂的,技术层面管理端和服务端构建是架构核 ...

  6. 快速构建一个vue项目

    首先介绍一下命令行构建一个vue项目步骤: 1.下载安装node.js(直接运行安装包根据步骤安装完),打开命令行输入:node -v ,出现版本号即安装成功. 2.命令行界面输入:cnpm inst ...

  7. [译]How to Install Node.js on Ubuntu 14.04 如何在ubuntu14.04上安装node.js

    原文链接为 http://www.hostingadvice.com/how-to/install-nodejs-ubuntu-14-04/ 由作者Jacob Nicholson 发表于October ...

  8. Nodejs学习笔记(六)--- Node.js + Express 构建网站预备知识

    目录 前言 新建express项目并自定义路由规则 如何提取页面中的公共部分? 如何提交表单并接收参数? GET 方式 POST 方式 如何字符串加密? 如何使用session? 如何使用cookie ...

  9. Nodejs学习笔记(十五)--- Node.js + Koa2 构建网站简单示例

    目录 前言 搭建项目及其它准备工作 创建数据库 创建Koa2项目 安装项目其它需要包 清除冗余文件并重新规划项目目录 配置文件 规划示例路由,并新建相关文件 实现数据访问和业务逻辑相关方法 编写mys ...

随机推荐

  1. 类(字符串型;日期时间型;Math)

  2. java多线程快速入门(二)

    通过继承Thread类来实行多线程 package com.cppdy; //通过继承Thread类来实行多线程 class MyThread extends Thread{ @Override pu ...

  3. Application.ProcessMessages; 的重要性

    https://files.cnblogs.com/files/del88/登陆光标_悬赏50元.zip ----------------------------------------------- ...

  4. poj3321 dfs序+树状数组单点更新 好题!

    当初听郭炜老师讲时不是很懂,几个月内每次复习树状数组必看的题 树的dfs序映射在树状数组上进行单点修改,区间查询. /* 树状数组: lowbit[i] = i&-i C[i] = a[i-l ...

  5. 字符串反转,例如"abc"反转"cba"

    package stringyiwen; /* * 字符串反转,例如"abc"反转"cba" */public class StringTestChar { p ...

  6. 获取修改CSS

    获取CSS使用方法css("CSS属性名称"), 示例css("color") 设置CSS使用方法css("CSS属性名称","属 ...

  7. bootstrap 全局样式设置

    HTML <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" co ...

  8. 几种常见SQL分页方式效率比较

    分页很重要,面试会遇到.不妨再回顾总结一下: 一:创建测试环境,(插入100万条数据大概耗时5分钟). create database DBTestuse DBTest 二:--创建测试表 creat ...

  9. [转] Java接口_interface_implements

    相对抽象类来讲,接口就是比抽象类还要抽象的抽象类,丝毫不带半点实现的内容.接口可以更加规范的对子类进行约束.接口全面地专业地实现了:规范和具体实现的分离.接口就是规范,定义的是一组规则,提现了现实世界 ...

  10. MQ确认机制之事务机制----confirm串行

    一:介绍 1.说明原理 A:生产者将信道设置成confirm模式,一旦信道进到confirm模式,所有该信道上发布的消息都会被指派一个唯一的ID(从1开始). 一旦消息被投递到所有匹配的队列后,bro ...