一. 搭建一个vue项目的完整步骤

1.安装node.js

下载地址

# 检查是否安装成功
node -v
npm -v

2.为了提高下载效率,可以使用淘宝镜像

# 淘宝镜像
npm install -g cnpm -registry=https://registry.npm.taobao.org # 检查是否安装成功
cnpm -v

3.安装webpack打包工具

webpack中文文档

npm install webpack webpack-cli -g

4.安装vue-cli脚手架

# 全局安装最新版本
npm install -g @vue/cli # 检查版本
vue -V

5.创建vue项目

# 命令:
vue create 项目名 # 1. Please pick a preset:
Manually select features # 2. check the features needed for your project:
Babel Router Linter/Formatter # 3. Use history mode for router?(Y/n)?
n # 4. Pick a linter/formatter config:
ESLint with error prevention only # 5. Pick additional lint features:
Lint on save # 6. Where do you prefer placing config for Babel,PostCSS,ESLint,etc.?
In package.json # 7. Save this as a preset for feature projects?(y/N)
y # 8. Save preset as:
my_vue

注意: 或者直接使用图形化界面创建vue项目

vue ui

然后根据页面提示创建项目.

6.安装axios

# 1. cd到项目目录下

# 2. 执行以下命令
npm install axios --save

7.安装element-ui

# 1. cd到项目目录下

# 2. 执行以下指令
npm i element-ui --save

二. 卸载vue-cli

# 全局安装:
npm install vue-cli -g # 全局卸载:
npm uninstall vue-cli -g # 查看vue版本:
vue -V
# 或者:
vue --version

三. 完全卸载webpack

# 在全局下安装:
npm install webpack -g
# 新版本的的webpack需要搭配webpack-cli一起安装:
npm install webpack webpack-cli -g # 安装指定版本:
npm install webpack@<version> -g
# 例如:
npm install webpack@3.4.1 -g # 在全局下删除:
npm uninstall webpack -g

完整搭建一个vue项目的更多相关文章

  1. vue-用Vue-cli从零开始搭建一个Vue项目

    Vue是近两年来比较火的一个前端框架(渐进式框架吧). Vue两大核心思想:组件化和数据驱动.组件化就是将一个整体合理拆分为一个一个小块(组件),组件可重复使用:数据驱动是前端的未来发展方向,释放了对 ...

  2. 如何搭建一个vue项目(完整步骤)

    参考资料 一.安装node环境 1.下载地址为:https://nodejs.org/en/ 2.检查是否安装成功:如果输出版本号,说明我们安装node环境成功 3.为了提高我们的效率,可以使用淘宝的 ...

  3. 如何搭建一个VUE项目

    搭建环境 搭建node环境 下载 1.进入node.js官方网站下载页,点击下图中框出位置,进行下载即可,当前版本为8.9.4,下载网址为:https://nodejs.org/zh-cn/downl ...

  4. 搭建一个VUE项目

    搭建环境 搭建node环境 下载 1.进入node.js官方网站下载页,点击下图中框出位置,进行下载即可,当前版本为8.9.4,下载网址为:https://nodejs.org/zh-cn/downl ...

  5. 从零开始使用vue-cli搭建一个vue项目及注意事项

    一.安装node.js 1.根据电脑的自行下载node.js安装包http://nodejs.cn 2.点击安装,按照正常的的一路点击下去 3.验证安装是否成功,按键win+r,输入cmd打开命令行工 ...

  6. 如何利用webpack4.0搭建一个vue项目

    作为一个初学者,记录自己踩过的坑是个好的习惯.我本身比较懒,这里刚好有时间把自己的搭建过程记录一下这里是参考文章   https://www.jianshu.com/p/1fc5b5151abf文章里 ...

  7. 使用Vue脚手架(vue-cli)从零搭建一个vue项目(包含vue项目结构展示)

    注:在搭建项目之前,请先安装一些全局的工具(如:node,vue-cli等) node安装:去node官网(https://nodejs.org/en/)下载并安装node即可,安装node以后就可以 ...

  8. 用脚手架搭建一个 vue 项目

    一.需要安装 node 环境 下载地址: https://nodejs.org/en/ 中文网: http://nodejs.cn/ 安装后为方便国内使用,可以把 npm 换成 taobao 的 cn ...

  9. VUE系列一:VUE入门:搭建脚手架CLI(新建自己的一个VUE项目)

    一.VUE脚手架介绍 官方说明:Vue 提供了一个官方的 CLI,为单页面应用快速搭建 (SPA) 繁杂的脚手架.它为现代前端工作流提供了 batteries-included 的构建设置.只需要几分 ...

随机推荐

  1. Caused by: com.mchange.v2.resourcepool.TimeoutException: A client timed out while waiting to acquire a resource from com.mchange.v2.resourcepool.BasicResourcePool@1483de4 -- timeout at awaitAvailable(

    Caused by: com.mchange.v2.resourcepool.TimeoutException: A client timed out while waiting to acquire ...

  2. Mariadb多实例启动脚本

    #!/bin/bash port=3306 mysql_user="root" mysql_pwd="centos" cmd_path="/app/m ...

  3. BZOJ3157 国王奇遇记——神奇的推式子

    先膜一发Miskcoo,大佬的博客上多项式相关的非常全 原题戳我 题目大意 求 \[\sum\limits_{i=1}^{n}i^mm^i\] 题解 设一个函数\(f(i)=\sum\limits_{ ...

  4. mongodb命令---花样查询语句

    闲言少叙 查出价格低于200的商品信息----包含商品名称,货物编号,价格,添加信息等 db.goods.find( {}}, {,,,} ) 商品分类不为3的商品 db.goods.find( {} ...

  5. Javascritp 数据结构和二叉树算法

    1,所有圆圈都是一个节点,里面的数字就是节点的值.8上面没有父节点,那么8就是根节点,而4,7,13没有子节点了,称之为叶子结点.其他的称之为:中间结点. 2,8节点是3和10的父节点,3是8的左孩子 ...

  6. docker国内镜像地址

    https://registry.docker-cn.com http://hub-mirror.c.163.com https://docker.mirrors.ustc.edu.cn

  7. list深拷贝和浅拷贝

    在Python中,经常要对一个list进行复制.对于复制,自然的就有深拷贝与浅拷贝问题.深拷贝与浅拷贝的区别在于,当从原本的list复制出的list之后,修改其中的任意一个是否会对另一个造成影响,即这 ...

  8. Luogu P2324 [SCOI2005]骑士精神 搜索

    刚开始写了个没迭代的...结果过了$qwq$ 然后迭个代..更快了.. #include<cstdio> #include<iostream> #define R regist ...

  9. BZOJ 1257 [CQOI2007]余数之和 数学

    都不知道说什么好...咕咕到现在.. 求:$\sum_{i=1}^n \space k\space mod \space i$ 即求:$n*k-\sum_{i=1}^n\space \lfloor \ ...

  10. parent([expr]) 取得一个包含着所有匹配元素的唯一父元素的元素集合。

    parent([expr]) 概述 取得一个包含着所有匹配元素的唯一父元素的元素集合.大理石构件 你可以使用可选的表达式来筛选. 参数 exprStringV1.0 用来筛选的表达式 示例 描述: 查 ...