搭建Vue开发环境

最新推荐文章于 2023-05-11 15:20:52 发布
最新推荐文章于 2023-05-11 15:20:52 发布
阅读量755 收藏
点赞数
分类专栏： 学习Vue 文章标签： vue.js vscode javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45186202/article/details/121707036
版权
本文详细记录了如何搭建Vue开发环境：从下载Vue.js开发版本，到在VSCode中创建项目，安装Live Server插件，解决Vue.js devtools的安装及VSCode中脚本的编写，从而完成初步的环境配置。
摘要由CSDN通过智能技术生成

搭建Vue开发环境

本文仅作为学习记录

注意:搭建方式有多种，根据课程视频暂时使用这种

1.下载开发版本Vue.js

在这里插入图片描述

2.打开VSCode，创建相应文件夹、文件，并调整到适当位置

在这里插入图片描述

3.插入一个准备工作，在vscode中安装live server插件

3.1 在vscode扩展中搜索live server，并安装

在这里插入图片描述

3.2 然后就可以使用这个插件了

在这里插入图片描述

4.打开之后，切换到控制台，发现有两个小提示

在这里插入图片描述

5.解决第一个小提示，在Google应用商店里找到Vue.js devtools，点击添加即可

在这里插入图片描述

6.解决第二个小提示，回到VSCode&#

最低0.47元/天 解锁文章
Rookie_lyj
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue开发环境搭建
qq_18238727的博客
07-13 1080
执行 node -v 和 npm -v 可查看node和npm的版本号：在nodejs安装路径下，新建node_global和node_cache两个文件夹 执行如下命令，设置缓存文件路径npm config set cache "自己的\node_cache" 执行如下命令，设置全局依赖包存放路径npm config set prefix "自己的\node_global"进入 C:\Windows\System32 找到cmd.exe，以管理员身份运行打开cmd窗口，执行如下命令：npm install
vue3最新开发环境篇
最新发布
felix_alone2012的博客
07-10 1228
本篇带vue新手从0搭建最新vue3开发环境，提供工具整合的最佳实践，为后续vue学习以及项目开发效率提速。
搭建 Vue开发环境
jj16165858的博客
08-29 407
1.vue-devtools 开发工具 浏览器的拓展工具 快速进行当前项目管理1.1 解压1.2 到对应文件夹中 cnpm i1.3 npm run build 将内容打包 整个一个网页 和js1.4 找到对应配置shells>chrom->json文件-》"persistent": true1.5谷歌——》设-》加载拓展应用 开发者模式-》加载拓展程序 vue-devtools-dev\shells\chrome2.rimraf 工具 强制删除。...
VUE开发环境搭建
weixin_52261391的博客
05-11 5934
vue.js是一套构建用户界面的渐进式框架,Vue 采用自底向上增量 开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，是一个基于MVVM结构的轻量 级框架，非常容易与其它库或已有项目整合。安装vue需要借助npm指令集，所以一般会先安装node.js环境。1.下载node.js环境()打开node.js的官网下载地址：http://nodejs.cn/download/选择适合自己系统的安装包，本文以windows x64系统为例。选择64位安装下载安装包后正常安装，
Vue开发环境搭建
FighterLiu的专栏
11-29 504
文章目录前言一、安装nodejs二、安装Vue-CLI二、安装VSCode 前言 在开发Vue项目的时候，我们通常使用vue-cli进行打包，编译项目。而vue-cli是基于nodejs+webpack封装的命令行工具，所以我们需要先安装nodejs然后在安装Vue-CLI。 一、安装nodejs 我们去官网下载nodejs，输入下载地址：https://nodejs.org/en/，选择相应的版本进行下载 安装完成后，检查一下nodejs有没有安装成功。在cmd窗口命令中输入 node -v ，
搭建vue开发环境
10-18
在开始 Vue 开发之前，你需要搭建一个合适的开发环境。以下是详细的步骤和相关知识点： 1. **安装 Node.js**： Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，提供了丰富的包管理器 npm（Node ...
搭建vue开发环境.docx
08-18
"搭建 Vue 开发环境" 在本文中，我们将详细介绍搭建 Vue 开发环境的步骤，包括安装 Node、WebStorm、 Vue 项目的创建和启动。 一、工具安装 在开始搭建 Vue 开发环境之前，我们需要安装一些必要的工具。首先，...
使用vue-cli+webpack搭建vue开发环境的方法
08-28
使用vue-cli+webpack搭建vue开发环境的方法 从今天开始，我们将学习如何使用vue-cli和webpack搭建一个Vue开发环境。这个方法将指导您从头开始搭建一个完整的Vue开发环境。 什么是Vue-cli？ Vue-cli是一个命令行...
webpack4手动搭建Vue开发环境实现todoList项目的方法
10-16
本文将详细介绍如何使用webpack4手动搭建Vue开发环境，以实现一个简单的todoList项目。首先，理解webpack的基础知识至关重要，它是现代前端项目中的一个模块打包工具，能够处理JavaScript、CSS、图片等资源，将其...
Vue 开发环境搭建
11-16
Vue 开发环境搭建，node 的安装，webpack 的安装，vue-cli 脚手架安装
vue的搭建以及框架的细致步骤
m0_59529616的博客
07-26 1256
1、开发环境搭建 1.1、服务端环境搭建 服务端技术栈：Node、Express、CORS、mongoose、multer 第1步：安装脚手架 命令如下： # 全局安装，一台计算机只需要执行一次即可 cnpm i -g express express-generator 第2步：创建项目 例如：D:\project\ 启动 cmd ，执行以下命令：1 express -e eshop-server 命令执行成功后，会创建 D:\project\eshop-server 文件夹，
搭建 Vue 开发环境
Mjh20180341121的博客
12-09 2518
Vue 开发环境搭建总结
Vue之开发环境搭建
mike031024的博客
08-14 431
1.下载并安装WebStorm（https://www.jetbrains.com/webstorm/download/#section=windows） 2.下载并安装node.js（https://nodejs.org/en/）， javascript运行环境(runtime),不同系统直接运行各种编程语言 3.安装淘宝npm镜像 在以管理员身份运行的cmd中输入：npm insta
vscode搭建vue开发环境
05-27
好的，以下是在VS Code中搭建Vue开发环境的步骤： 1. 先安装Node.js，可以从官网下载安装包进行安装。安装完成之后，在命令行中输入`node -v`和`npm -v`，来确认是否安装成功。 2. 安装Vue CLI，打开命令行，输入`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值