在windows上创建一个Vue项目

最新推荐文章于 2025-01-26 11:04:43 发布
原创 最新推荐文章于 2025-01-26 11:04:43 发布 · 467 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue #npm #windows #nodejs

本文指导如何在电脑上安装Node.js和npm，通过淘宝镜像安装gcnpm并配置Vue CLI，一步步创建和运行Vue项目，适合初学者入门。

首先，我们需要确保我们的电脑上存在node和npm。

如果没有，请前往node.js官网下载
node.js官网

查看方法是否已安装方法

node -v		#查看版本信息
npm -v

如图，出现版本信息表示已安装
在这里插入图片描述

安装完成进行以下操作。

1、使用阿里云淘宝的镜像安装模块

npm  install  -g  cnpm  --registry=https://registry.npm.taobao.org

2、安装vue-cli

cnpm install vue-cli -g

3、查看vue是否安装成功

vue list

完成以上就可以开始创建一个vue项目了！！

  • 我们需要跳转到响应的目录文件夹

使用命令vue init webpack (项目名称)

vue init webpack test

或者使用命令vue create vue_test (项目名称)

vue create vue3_test
  • 根据提示。完成操作就可以初始化一个vue项目
    跳转到项目目录。使用命令npm install,npm run dev运行vue项目
npm run dev

出现下图，代表启动成功。并且可以通过访问localhost:8080访问项目
在这里插入图片描述
在这里插入图片描述

如何创建一个vue项目（初始项目搭建）
12-14
本文将详细介绍如何在Windows环境下，使用Visual Studio Code或命令行工具创建一个Vue项目的初始搭建步骤。 首先，确保你的计算机上已经安装了Node.js，因为Vue CLI（命令行界面工具）依赖于Node.js的包管理器npm。...
精选资源
第一次创建vue项目
01-08
自动找到了vue所在，创建就可以 3：打开后显示package.json,yarn run 等它安装，下面会有进度条（等待） 安装完成的文件夹 4：启动 右上角配置一下 点击 本地打开就可以了 或者在terminal控制台用 npm run dev...
windows下使用vite创建vue项目
Mr_XiMu的博客
04-18 3734
windows下使用vite创建vue项目
windows 下创建vue项目
三千
04-10 471
1.首先第一步检查自己电脑上是否有node.js 打开cmd窗口 输入node -v 看看有没有输入node版本号 没有安装node.js 请自行安装node.js 2.检查npm管理包 npm是集成在node中的 输入npm -v 3.安装cnpm，由于npm有些资源被屏蔽，有些是国外资源 ，这里安装cnpm国内镜像输入命令 npm install -g cnpm --regi...
Windows下创建Vue项目教程
weixin_44669966的博客
01-21 1204
1. 安装node.js https://nodejs.org/en/download/ 选择对应系统的node可执行文件 安装完成后，打开cmd 输入node -v 输入npm -v 都正常输出版本就可以进行下一步啦???? 2. 安装vue 使用npm去安装vue的话也可以，但是安装速度较慢，使用国内源镜像安装较快（所以这一步不是必须的） 安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 安装vue-cli脚
Windows下搭建VUE开发环境
yjkhtddx的专栏
10-17 2859
VS Marketplace 链接: https://marketplace.visualstudio.com/items?VS Marketplace 链接: https://marketplace.visualstudio.com/items?使用npm配置缓存和全局安装路径(注：配置环境变量时已经配置全局安装路到Path)环境变量，设置成nodejs的安装路径，我的是。我使用的是腾讯云镜像站。
‌Windows系统cmd命令行创建vue项目
最新发布
sungencheng的博客
01-26 893
windows系统cmd命令行创建vue项目
创建一个vue项目
dreams_dream的博客
07-27 1万+
创建一个vue3项目
二、创建第一个VUE项目
2401_83367969的博客
12-26 1499
确保已经安装了 Node.js 和 npm（一般安装 Node.js 时会自动安装 npm），并且通过 npm install -g @vue/cli 命令全局安装了 Vue CLI（命令行工具）。
pycharm新建Vue项目的方法步骤(图文)
12-20
在PyCharm中创建一个新的Vue.js项目，你需要遵循一系列...希望以上步骤对你在PyCharm中创建Vue项目有所帮助。如果需要更多关于Vue-CLI项目在PyCharm中的配置方法，可以查阅相关的技术文章或文档，以便深入学习和实践。
windows系统搭建VUE环境(vue-cli4)
dreamingbaobei的博客
03-26 4910
第一步:node环境安装 第二步:node环境检测 第三步:设置nodejs的global和cache路径 第四步: 配置PATH环境变量 第五步: vue-cli脚手架安装 第六步: 创建一个项目hello-world 第七步: 修改默认端口
如何在windows下创建并启动一个vue项目
qq_40276753的博客
05-26 310
个人学习记录，为了效率不是很详细，有遇到问题请评论。 npm i -g @vue/cli-init 在有npm环境的情况下进行vue的脚手架安装 解释： npm 导包软件 i linux指令 install的缩写 -g linux指令 全局安装 @vue/cli-init 指定安装的包名 下一步： vue init webpack project 解释： vue 初始化 ,使用webpack打包工具去配置project(项目名) 下一步： 接下来就看到目录中有完成后的文件夹。 请先在项目目录下
windows下搭建vue项目环境加创建项目超详细小白步骤!
热门推荐
王佩健的博客
06-08 1万+
1. 第一步安装node.js 官网：https://nodejs.org/zh-cn/ 2.下载好按步骤安装“推荐都默认” 3.点开运行调用出cdm 输入node -v npm -v 出现版本号就是安装完成了 注意不要乱升级npm 以免造成问题 下面是官方对应的版本，安装node.js自带npm https://nodejs.org/zh-cn/download/releases/ 为了提高我们的效率，可以使用淘宝的镜像：http://npm.taobao.org/ 输入： npm in
在Windows 上创建一个 Vue 项目
daijianzhou的专栏
08-25 319
1.在Windows上安装Nodejs #查看版本 $ npm -v #升级 npm cnpm install npm -g #升级或安装 cnpm npm install cnpm -g 2.安装vue #最新稳定版 npm install vue或cnpm install vue #ps:cnpm需要配置淘宝镜像 #查看版本 vue -V 3.创建一个vue项目 # 全局安装 vue-cli cnpm install --global vue-cli # 创建一个基于 webpack
从零创建一个vue项目（基于vue2.X，以windows系统为例）
weixin_40563746的博客
08-13 696
1.安装nodejs,安装方法参见： 2.将nodejs和vue的路径加入环境变量 3.执行vue create projectName 创建项目，为保证后续安装其他组件方便，vue版本选2.X 4.执行npm run serve ，编辑器提示访问地址，一般是 http://localhost:8080/，看到 Welcome to Your Vue.js App 的界面就算成功了。 5.根据实际需要，安装UI框架，例如ant design of vue npm install ant-design-vue
window搭建vue项目
白小白的小白的博客
08-03 260
当安装好node.js，并配置好环境变量后，开始安装vue-cli脚手架构建工具：npm install vue-cli -g 查看版本的各个命令： cmd命令行中： node -v // node版本 npm -v // npm版本 cnpm -v // cnpm是否正常 npm vue -v // vue版本 vue -V // vue-cli版本 在目录上找一个文件夹放工程用的： cd 目录路径 安装vue脚手架输入：vue init webpack test ，注意这里的“test”.
创建vue项目
zeroone的博客
11-02 843
使用图形页面和命令行形式新建vue项目
vue-cli脚手架在Windows下生成Vue项目
kirinlau的专栏
07-18 1678
vue-cli是什么？为什么要使用vue-cli？ vue-cli 是vue.js的脚手架工具，用于自动生成vue.js模板工程的，为什么不直接引用vue.js使用呢？ 因为这样构建项目时才会不需要我们去做一些额外的无用功，更专注于代码的实现： 即这样才会显得正式一点。1，安装node 2，安装npm（node package manger，目前来说node自带可以免安装） 3，安装c
windows下搭建Vue环境，以及新建vue项目
weixin_44442366的博客
07-15 316
1:先下载安装nodejs 官网地址https://nodejs.org/en/，安装成功后查看版本node -V, npm-V 2：终端输入命令 npm install -g @vue/cli 进行vue-cli最新版本的安装,安装成功可以查看当前版本,vue -V 3:安装成功后可以新建项目啦,新建命令:vue create vue-demo, //vue-demo是项目名称 然后选择安装方式 default是默认创建,这里我们选择第二个自定义选择安装 我这里选择了一个Router(路由)
怎么在Windows 上启动一个vue项目
02-07
在 Windows 上启动一个 Vue 项目需要安装 Node.js 和 Vue 命令行工具 (Vue CLI)。 安装 Node.js： 1. 在 Node.js 官网 (https://nodejs.org/) 下载最新版本的 Node.js。 2. 双击下载的安装包，按照提示安装 Node.js。 安装 Vue CLI： 打开命令提示符窗口，输入以下命令： ``` npm install -g @vue/cli ``` 安装完成后，即可在命令提示符窗口中使用 Vue 命令。 创建 Vue 项目： 在命令提示符窗口中输入以下命令，创建一个名为 "my-project" 的 Vue 项目： ``` vue create my-project ``` 安装完成后，进入项目目录： ``` cd my-project ``` 启动项目： 在项目目录中输入以下命令，启动项目： ``` npm run serve ``` 项目启动后，会在浏览器中打开项目页面。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

languageStudents

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值