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. Collections.synchronizedList使用

    1.SynchronizedList类具体代码: static class SynchronizedList<E> extends SynchronizedCollection<E& ...

  2. Pros and Cons of Game Based Learning

    https://www.gamedesigning.org/learn/game-based-learning/ I remember days gone by at elementary schoo ...

  3. python--模块学习之xml模块

    xml即可扩展标记语言,它可以用来标记数据.定义数据类型,是一种允许用户对自己的标记语言进行定义的源语言. 本文主要学习的ElementTree是python的XML处理模块,它提供了一个轻量级的对象 ...

  4. MongoDB Index

    索引通常能够极大的提高查询的效率,如果没有索引,MongoDB在读取数据时必须扫描集合中的每个文件并选取那些符合查询条件的记录. 这种扫描全集合的查询效率是非常低的,特别在处理大量的数据时,查询可以要 ...

  5. cloudevents js sdk 简单试用

    cloudevents 目前官方提供了不同语言的sdk,以下是js 的简单学习试用,从目前来说更新不是很好 clone 代码 git clone https://github.com/cloudeve ...

  6. 2.学习SpringMVC注解入门篇

    一.SpringMVC执行流程 . 二.创建项目学习SpringMVC注解 按照我之前的SpringMVC创建项目,首先创建一个项目springmvc01,配置好pom.xml,web.xml,spr ...

  7. C# VS常用操作

    VS点击项目,就会打开文件,其实我只是想选中而已, 在这个地方可以改. 原文:https://blog.csdn.net/yellowegg/article/details/12217309

  8. 第02组 Alpha冲刺(3/4)

    队名:十一个憨批 组长博客 作业博客 组长黄智 过去两天完成的任务:写博客,复习C语言 GitHub签入记录 接下来的计划:构思游戏实现 还剩下哪些任务:敲代码 燃尽图 遇到的困难:Alpha冲刺时间 ...

  9. 【AtCoder】 ARC 096

    link C-Half and Half 题意:三种pizza,可以花\(A\)价钱买一个A-pizza,花\(B\)价钱买一个B-pizza,花\(C*2\)价钱买A-pizza和B-pizza各一 ...

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

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