Vue  搭建项目

一.node下载安装:

1.下载:https://nodejs.org/en/download/

2.安装默认许选择,下一步就行;

3.安装完之后就可以使用npm命令

二.通过@vue/cli方式安装:

1.全局安装@vue/cli  :

npm install -g @vue/cli  最新版本3.x,可以通过ui界面方式创建

2.创建项目:

vue create 项目名称

vue ui 直接打开web页面,通过界面方式创建项目

三.通过vue-cli方式安装:

1.全局安装vue-cli

npm install --global vue-cli vue-cli 旧版本

2.通过webpack方式初始化vue项目

vue init webpack 项目名称

3.根据提示设置项目信息即可

 

四.运行:

npm run dev

五.编写代码调试:

跳转到:https://www.cnblogs.com/zlp520/p/10924962.html

六.生成:

npm run build

七.扩展:

1.npm 安装cnpm:
npm install -g cnpm --registry=https://registry.npm.taobao.org 安装完之后就可以使用cnpm和npm命令一样,只是cnpm是淘宝镜像而已  

2.npm安装安装yarn:

npm install -g yarn

备注:-g或 --global代表全局的意思

全局安装:
npm install xxx -g 安装到 \AppData\Roaming\npm\node_modules目录
本地安装:
npm install xxx 安装到命令行所在目录的node_module目录。

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

  1. vue搭建项目

    vue-cli 作用:快速搭建项目脚手架 安装3.0:npm i -g @vue/cli 安装桥接工具:npm i -g @vue/cli-init (vue-cli 3和旧版使用相同的命令,所以2被 ...

  2. vue搭建项目前奏曲——vue-cli

    vue-cli是快速构建这个单页应用的脚手架,这个可是官方的.官方给的建议,如果你是初次尝试Vue,哪就老老实实用普通的书写引入js文件,这里牵扯太多的东西,例如webpack.Node.js.npm ...

  3. vue搭建项目步骤(二)

    上篇是搭建Vue项目的基本,接下来是继续对做项目的记录.顺序并不一定. 五.对页面入口文件的修改: 众所周知,main.js 程序入口文件,加载各种公共组件,App.Vue为 页面入口文件.但是有时候 ...

  4. 使用vue搭建项目(创建手脚架)

    第一步:切换到创建的目录 创建项目 vue cerate [model] 第二步:切换到创建好的项目,然后创建element vue add element 第三步:创建router vue add ...

  5. vue搭建项目之设置axios

    首先要下载axios: npm install axios -S 要注意的是,axios不支持Vue.use();这种方式,可以改写原型链. 第二步就是新建axios存放位置: 在项目中src中单独建 ...

  6. vue搭建项目之设置代理

    前面将项目页面.axios.组件等都准备好了,现在就差设置代理了: 首先在config下新建两个文件,分别叫做dev.uri.js和prod.uri.js,代码为: module.exports = ...

  7. 关于vue搭建项目运行出行的错误问题,简直是大坑啊

    解决方法简单粗暴,非常简单粗暴 直接在根目录新建一个test文件夹就可以搞定,用来放置配置文件的 折腾了我一上午啊

  8. vue-cli 新手 搭建项目 一

     新手入坑vue 搭建项目  一.安装 vue-cli 1.打开cmd 输入命令(已自行安装好npm node等) npm install --global vue-cli  (全局安装) 二.创建项 ...

  9. Vuejs实例-01使用vue-cli脚手架搭建Vue.js项目

    [TOC] 1. 前言 vue-cli 一个简单的构建Vue.js项目的命令行界面 整体过程: $ npm install -g vue-cli $ vue init webpack vue-admi ...

随机推荐

  1. ES6学习笔记--default,rest

    default 意思是默认值.大家可以看下面的例子,调用animal()方法时忘记了传参数,传统的做法就是加上这一句type= type || 'cat' 来指定默认值. function anima ...

  2. python的虚拟环境管理工具venv使用方法介绍及与nodejs的包管理方式对比

    一.nodejs 包管理方式 我们知道, nodejs的包管理工具npm可以安装项目所需要的包,安装方法及区别如下: npm i module_name -g 全局安装 npm i module_na ...

  3. 一起学Makefile(四)

    变量的定义 makefile中的变量,与C语言中的宏类似,它为一个文本字符串(变量的值,其类型只能是字符串类型)提供了一个名字(变量名). 变量的基本格式: 变量名   赋值符   变量值 变量名指的 ...

  4. ES6 fetch方法封装

    // 请求路径 let url = 'http://jsonplaceholder.typicode.com/users' // 传输数据参数 const dataName = { name: &qu ...

  5. 【cf比赛记录】Codeforces Round #601 (Div. 2)

    Codeforces Round #601 (Div. 2) ---- 比赛传送门 周二晚因为身体不适鸽了,补题补题 A // http://codeforces.com/contest/1255/p ...

  6. Instance Segmentation with Mask R-CNN and TensorFlow

    Back in November, we open-sourced our implementation of Mask R-CNN, and since then it’s been forked ...

  7. Android Studio 之 数据存活【2】,返回桌面切换回来,内容还保存着

    使用ViewMode SavedState来使得ViewModel在系统杀死后台进程的时候得以存活. 本集使用到的库,需要在gradle中添加: implementation 'androidx.li ...

  8. eclipse无法访问sun.misc.Unsafe类的解决办法

    参考:https://www.cnblogs.com/duanxz/p/6090442.html

  9. UnityVR案例 - VR僵尸大战(HTC VIVE)

    使用HTCvive设备开发的一款射击类游戏(Unity5.6.3),玩家在游戏中使用手枪.手榴弹或者技能杀死僵尸. 亮点功能:手势识别,语音唤醒(关键词识别) 手势识别:玩家使用手柄在游戏中绘制事先录 ...

  10. dubbo源码分析- 集群容错之Cluster(一)

    1.集群容错的配置项 failover - 失败自动切换,当出现失败,重试其他服务器(缺省),通常用于读操作,但重试会带来更长的延时. failfast - 快速失效,只发起一次调用,失败立即报错.通 ...