Vue2.0的安装

server/2025/1/22 14:31:44/

1.首先查看是否已经安装了node.js

选择以管理员方式打开命令提示符(权限较高),或者通过cmd的方式打开

打开后输入node -v 查看自己电脑是否安装node,以及版本号

node -v

如果没有的话,请查看Node.js的安装

2.Vue和脚手架安装

安装vue.js

一般是全局安装,-g是全局安装,指安装到global全局目录去。

如果安装3.0版本的可以选择这个命令(二选一,根据自己的淘宝镜像源设置选择)

npm install vue -gcnpm install vue -g

需要版本为2.0版本的,使用这个命令:

npm install -g @vue/cli

查看安装的vue信息npm info vue 或者cnpm info vue,不过我最常用vue -V
查看安装的vue版本    npm list vue

安装webpack模板

运行命令 npm install webpack -g

npm install webpack -g 

webpack 4x以上,webpack将命令相关的内容都放到了webpack-cli,
所以还需要安装webpack-cli:npm install --global webpack-cli

npm install --global webpack-cli

 安装成功后可使用webpack -v查看版本号。

安装vue-router

npm install -g vue-router

3. 创建项目

1、命令创建项目

(最好在cd到D盘的某个位置,即项目的路径,否则项目会新建在C:\Users\Administrator\,也可以直接在想要的项目路径下输入cmd)

 vue init webpack 项目名

项目名不要取中文和大写字母。

进行一些配置:

  • Project name(工程名):回车(含大写字母给我报错了,我给改了my-vue)
  • Project description(工程介绍):回车
  • Author:作者名 :回车
  • Vue build ==> (是否安装编译器)runtime-compiler、 runtime-only 都是打包方式,第二个效率更高;
  • Install vue-router ==> 是否要安装 vue-router,项目中肯定要使用到路由,所以Y 回车;
  • Use ESLint to lint your code ==> 是否需要ESLint检测代码,目前我们不需要所以 n 回车;
  • Set up unit tests ==> 是否安装 单元测试工具 目前我们不需要 所以 n 回车;
  • Setup e2e tests with Nightwatch ==>是否需要端到端测试工具目前我们不需要所以n回车;
  • Should we run npm install for you after the project has been created? (recommended) (Use arrow keys)==> 安装依赖npm install
  • 回车;

2.项目仪表盘创建项目

切到项目创建的文件位置

vue ui

3.打包上线

编写好程序后可以打包给后端,然后上线。

npm run buildnpm run build:prod

 【超详细全过程】使用WebStorm创建一个Vue项目 - 朱李洛克 - 博客园


http://www.ppmy.cn/server/160484.html

相关文章

25.1.21学习内容

A - 我是循环大王 问题陈述 有 N 条蛇。 最初,第 i 条蛇的厚度为 Ti​,长度为 Li​。 蛇的重量定义为其厚度和长度的乘积。 对于每个满足 1≤k≤D 的整数 k,找出当每条蛇的长度增加 k 时,最重蛇的重量。 约束条件 1≤N,D≤1…

《自动驾驶与机器人中的SLAM技术》ch4:基于预积分和图优化的 GINS

前言:预积分图优化的结构 1 预积分的图优化顶点 这里使用 《自动驾驶与机器人中的SLAM技术》ch4:预积分学 中提到的散装的形式来实现预积分的顶点部分,所以每个状态被分为位姿()、速度、陀螺零偏、加计零偏四种顶点&am…

git常用命令学习

目录 文章目录 目录第一章 git简介1.Git 与SVN2.Git 工作区、暂存区和版本库 第二章 git常用命令学习1.ssh设置2.设置用户信息3.常用命令设置1.初始化本地仓库init2.克隆clone3.查看状态 git status4.添加add命令5.添加评论6.分支操作1.创建分支2.查看分支3.切换分支4.删除分支…

ASP.NET Blazor部署方式有哪些?

今天我们来说说Blazor的三种部署方式,如果大家还不了解Blazor,那么我先简单介绍下Blazor Blazor 是一种 .NET 前端 Web 框架,在单个编程模型中同时支持服务器端呈现和客户端交互性: ● 使用 C# 创建丰富的交互式 UI。 ● 共享使用…

C语言小任务——1000以内含有9的数字

步骤 第一步:分类 含有九的可能的情况: 个位有9,十位有9,百位有9,而根据组合数,我们可以得出,一共有7种情况,分别是 9##,#9#,##9, 99#,9#9,#…

JavaScript笔记进阶篇01——作用域、箭头函数、解构赋值

黑马程序员视频地址: 黑马程序员前端JavaScript入门到精通全套视频教程https://www.bilibili.com/video/BV1Y84y1L7Nn?vd_source0a2d366696f87e241adc64419bf12cab&spm_id_from333.788.videopod.episodes&p152 目录 作用域 局部作用域 函数作用域 块…

SQL 递归 ---- WITH RECURSIVE 的用法

SQL 递归 ---- WITH RECURSIVE 的用法 开发中遇到了一个需求,传递一个父类id,获取父类的信息,同时获取其所有子类的信息。 首先想到的是通过程序中去递归查,但这种方法着实孬了一点,于是想,sql能不能递归查…

分布式 ID 生成策略:应用场景与 ShardingSphere 实现

在分布式系统中,分布式 ID(Distributed ID)是一种用于唯一标识各类数据记录的技术,通常用于数据库主键、日志、消息队列等场景。由于分布式系统的特点,各个服务实例通常会在不同的物理节点上进行独立运行,这…