Vue.js:安装node js到构建一个vue并启动它
| ylbtech-Vue.js:从安装node js到构建一个vue并启动它 |
| 1.返回顶部 |
1、安装node js
下载地址:http://nodejs.cn/download/
2、安装完成后运行Node.js command prompt(node -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
| 2.返回顶部 |
| 3.返回顶部 |
| 4.返回顶部 |
| 5.返回顶部 |
| 6.返回顶部 |
| 7.返回顶部 |
| 8.返回顶部 |
| 9.返回顶部 |
| 10.返回顶部 |
| 11.返回顶部 |
| 12.返回顶部 |
| 13.返回顶部 |
| 14.返回顶部 |
| 15.返回顶部 |
| 16.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
Vue.js:安装node js到构建一个vue并启动它的更多相关文章
- vue学习之node.js
Node.js是一个Javascript运行环境(runtime environment),发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装.本文详细介绍了No ...
- 从安装node js到构建一个vue并启动它
1.安装node js 下载地址:http://nodejs.cn/download/2.安装完成后运行Node.js command prompt(node -v查看安装版本) 3.安装npm(由于 ...
- Windows10安装node.js,vue.js以及创建第一个vue.js项目
[工具官网] Node.js : http://nodejs.cn/ 淘宝NPM: https://npm.taobao.org/ 一.安装环境 1.本机系统:Windows 10 Pro(64位)2 ...
- 安装node.js、webpack、vue 和vue-cli 以及安装速度慢/不成功的解决方法
1.安装node.js 地址:https://nodejs.org/en/ 下载安装软件之后,点击下一步即可 打开dos窗口,输入cmd能快速打开,输入npm -v 和 node -v 能显示出版本 ...
- 构建微服务开发环境5————安装Node.js
[内容指引] 下载Node.js: Mac下安装Node.js: Windows下安装Node.js; 查看node和npm的版本. 一.下载Node.js 访问Node.js官网:https://n ...
- vue.js开发环境搭建以及创建一个vue实例
Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...
- [译]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 ...
- Mac 下安装node.js
Node.js 简介 Node.js 是一个用Chrome's V8 JavaScript engine 构建的 JavaScript 运行时框架.Node.js 使用事件驱动.非阻塞式 I/O 模块 ...
- Mac 下安装node.js(转载)
原文地址:http://blog.csdn.net/u011619283/article/details/52368759 Node.js 简介 Node.js 是一个用Chrome's V8 Jav ...
随机推荐
- 【DFS】codeforces B. Sagheer, the Hausmeister
http://codeforces.com/contest/812/problem/B [题意] 有一个n*m的棋盘,每个小格子有0或1两种状态,现在要把所有的1都变成0,问最少的步数是多少?初始位置 ...
- msp430项目编程11
msp430中项目---步进电机控制系统 1.步进电机工作原理 2.电路原理说明 3.代码(显示部分) 4.代码(功能实现) 5.项目总结 msp430项目编程 msp430入门学习
- php 翻转字符串
//方法一 function strrev_charset($string,$charset='utf-8'){ if(!is_string($string) || !mb_check_encodin ...
- Codeforces 658D Bear and Polynomials【数学】
题目链接: http://codeforces.com/contest/658/problem/D 题意: 给定合法多项式,改变一项的系数,使得P(2)=0,问有多少种方法? 分析: 暴力求和然后依次 ...
- PAT (Advanced Level) 1036. Boys vs Girls (25)
简单题. #include<iostream> #include<cstring> #include<cmath> #include<algorithm> ...
- Spring Boot使用MyBatis 3打印SQL的配置
普通Spring下的XML文件配置: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE co ...
- Java中的重写
以下内容引用自http://wiki.jikexueyuan.com/project/java/overriding.html: 如果一个类从它的父类继承了一个方法,如果这个方法没有被标记为final ...
- JavaScript Prototype in Plain Language
非常好的文章: http://javascriptissexy.com/javascript-prototype-in-plain-detailed-language/ jan. 25 2013 14 ...
- linux 中安装JDK
一般公司差点儿相同全部的server都是搭建在Linux上面的,所以这就免不了.(要是使用Java语言)要在Linux上面布一套JDK也就是Java虚拟机环境. 以下.我详细说一下安装过程,以及可能出 ...
- HTML的DIV如何实现垂直居中
外部的DIV必须有如下代码 display:table-cell; vertical-align:middle; 这样可以保证里面的东西,无论是DIV还是文本都可以垂直居中
