Vue.js开发环境搭建-新建项目

最新推荐文章于 2025-04-11 19:04:17 发布
最新推荐文章于 2025-04-11 19:04:17 发布
阅读量568 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： Vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/q646926099/article/details/65946764
本文详细介绍了如何使用Vue.js脚手架工具(vue-cli)快速搭建一个Vue.js项目。包括获取官方模板、初始化项目、安装依赖及启动项目等步骤。

安装好Vue.js脚手架工具(vue-cli)后，根据Vue.js模板新建一个项目.

1.使用vue指令-vue list 获取官方模板，官方提供多种模板.

2.使用vue init 根据相应的模板来建立vue项目

假设根据webpack模板来新建，就是vue init webpack，根据一系列提示在当前目录下建立vue项目。

3.项目新建后可以看到对应的vue项目的目录结构，参考如下：


4.安装依赖，在指定的项目下：cnpm install，安装完毕后，项目目录下多了一个node_modules目录。

5.启动项目 cnpm run dev

Vue.js 跨平台开发：Uni-app实战教程
AI架构全栈开发实战笔记
06-02 1033
在移动互联网时代，开发者常面临“多端开发”的痛点：同一个应用需要适配微信/支付宝小程序、iOS/Android App、H5网页，传统模式需为每个平台写一套代码，重复劳动率高达70%。本文聚焦“Uni-app+Vue.js”技术组合，教你用一套代码搞定多端，覆盖开发环境搭建、核心功能实现、多端适配技巧等全流程。本文从“为什么选Uni-app”讲起，用“开奶茶店”的故事类比核心概念，逐步拆解Uni-app的架构原理；通过“校园二手交易平台”实战项目，演示从环境搭建到多端发布的全流程；
使用 Vue CLI 创建 Vue.js 项目的详细指南
Ttbraver
12-31 1992
千里之行，始于足下。
构建vuejs项目
u013662924的博客
11-06 310
目的：在D盘myvue下构建vue项目 过程： 1.D盘创建myvue文件 2.命令进入myvue(cmd)； D: cd myvue 3.在目录下创建一个基于 webpack 模板的新项目 vue init webpack my-vue-project 4.安装项目依赖（cd 上一步创建的my-vue-project文件夹） cd my-vue-project 安装依赖资源 cnpm in...
vue.js创建项目（二）
花开不败才是姿态
05-29 1035
创建一个基于 webpack 模板的新项目 1.用cd命令进入到将要新建工程的目录。 例如：D:\vue\FirstProject。 然后输入命令：vue init webpack my-project 　 最后两个为单元测试的no也可以改为ye...
安装vue.js以及创建第一个vue项目
spurs611的博客
12-05 450
安装vue.js 第一步：下载node.js node.js官网下载地址：https://nodejs.org/en/ 选择推荐的或你想要的版本下载，下载完后，安装路径自定义，自行安装。 我的安装路径是：F:\gongju\nodejs 第二步：配置node.js并验证安装是否成功 在你的安装路径中创建node_global与node_cache文件夹 以管理员身份...
vuejs创建新项目--创建页面--v-if--v-for-v-if具有更高的优先级
琳琳的博客
03-12 398
安装好vue,创建新项目,输入命令 vue init webpack my-project 填写详细信息,如项目名称,作者等即可.
Vue.js之构建项目初始步骤（二）
Quincy.Coder的博客
03-06 1601
接上回： http://blog.csdn.net/qq_33733970/article/details/79441889 报错解决： This dependency was not found: * common/stylus/index.styl in ./src/main.js 解决方案： 在这个路径文件夹下：D:\Django\Vue_Project\vu...
vue.js的学习，vue项目基于的软件和vue.js环境的搭建及项目的创建
weixin_44756644的博客
02-08 1015
vue.js的学习，vue项目基于的软件和vue.js环境的搭建 一. 所需的编辑器：官网搜索安装 visual studio code 二. vue.js环境的搭建分为三步 1.安装Node.js（JavaScript运行环境） 2.安装npm(cnpm) 3.搭建Vue-cli 脚手架 开始正式安装。 1、Node.js安装 首先，官网下载 Node.js，windows系统下载 Windo...
在VS Code中基于TypeScript使用Vue.js搭建Babylon.js的开发环境
ttod的博客
02-03 982
在VS Code中基于TypeScript使用Vue.js搭建Babylon.js的开发环境
02-Vue.js环境准备-使用vue-cli快速搭建项目(cli2)
光脚丫思考的专栏
09-05 3万+
一、概述 在用Vue.js构建大型应用时，推荐使用npm安装，npm能很好的和webpack等打包工具配合使用。如果使用npm过程中安装速度过慢，可以考虑使用淘宝镜像的cnpm来代替npm。 首先Vue的安装依赖于Node.js，要保证你的计算机上已经安装过Node.js。可以参考前面的文章：https://blog.csdn.net/GJYSK/article/details/108210708 如何查看Node是否安装或者Node版本呢？ 进入cmd，输入命令：node -v，回车查看，node最好使
Vue.js项目搭建
冰凉的枷锁的博客
10-18 929
使用npm/cnpm命令 参考地址：http://blog.csdn.net/haoaiqian/article/details/72453286 VUE推荐开发环境： Node.js：javascript运行环境（runtime），不同系统直接运行各种编程语言 npm：Nodejs下的包管理器。 webpack：它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做...
如何从零开始搭建一个 Vue.js 项目（新新手指南，超级详细）
最新发布
mark0758的博客
04-11 1815
从零开始构建vue。开发组件（如计数器）熟悉 Vue 语法。（可选）添加路由支持多页面。构建并部署到生产环境。通过以上步骤，你已经搭建了一个功能完整的 Vue 项目！接下来，可以根据需求扩展功能，如添加状态管理、API 调用或复杂交互。Vue 的生态丰富且文档友好，持续学习和实践会让你更得心应手。如果你需要更详细的某部分（如 Pinia 集成、TypeScript 配置或部署细节），可以告诉我，我会进一步补充！
怎样创建一个VUE项目（超简单）
热门推荐
m0_70619994的博客
09-25 7万+
一、安装node.js 二、搭建vue环境 1、全局安装@vue/cli模块包 2、执行命令 3、检查是否安装成功 三、创建vue项目 1、创建项目 2、选择模板和包管理器，等待项目创建完毕 四、启动vue项目 1、执行命令 2、浏览项目页面 五、vue项目目录文件含义和作用 六、修改端口号 七、清理欢迎界面 补充：解决App.vue 代码是黑白色的方法
vue 如何新建一个项目
ygy211715的博客
02-27 6万+
身为入行未深的小白前端，不断的学习是我们不可丢失的习惯。前端流行的框架也是层出不穷，vue在众多框架中脱颖而出。今天花了两个小时的时间自己走了一边创建vue项目的流程，跟你们分享。1：打开cmd命令行，首先安装node步骤：https://nodejs.org/en/download/      node官网，选择跟自己的电脑匹配的版本进行下载，然后一步步的安装即可，输入node -v，如果出现版...
VsCode新建VueJs项目
陈年雪菜粥
06-22 2万+
使用vue-cli快速构建项目 ( vue-cli 是vue.js的脚手架，用于自动生成vue.js模板工程的。 安装vue-cli之前，需要先安装了vue和webpack )· node -v //(版本低引起：bash: npm: command not found) · npm -v //以上帮助检查是否安装 node npm · 输入vue，//测试vue是否安装成功 · 输入vue
JAVA Freemarker(5)---取值过程
lovoo的博客
09-27 767
1、创建controller 2、配置spring-servlet.xml文件 3、前端页面展示 —————————————————————————————————————————————————–java架构师项目实战,高并发集群分布式,大数据高可用视频教程，共760G下载地址：https://item.taobao.com/item.htm?id=55588852620101.高级架构师四
使用vue创建项目的详细步骤
幸运小男神的博客
03-26 5万+
一、前言 1、本例环境 node.js：v12.14.1 npm：v6.13.4 vue：@vue/cli 4.2.3 2、node.js环境安装与测试 由于vue的安装与创建依赖node.js（JavaScript的运行环境）里的npm（包管理和分发工具），因此需要先确保安装node.js。 检测方式：打开cmd命令窗口（Window + R，输入cmd然后回车），输入 node ...
使用命令创建vue.js项目
xiejunna的博客
12-31 3913
前序：开发vue项目需要借助node环境，进行以下步骤时，要先装好node环境。 推荐使用淘宝镜像安装，速度比较快，可安装在c盘，命令是： npm install -g cnpm --registry=https://registry.npm.taobao.org 安装模块时，使用 cnpm 命令来安装模块，例如：cnpm install [name]， 淘宝镜像安装好之后，安装安装webp
新建vue项目完整步骤
新前端小白的博客
09-17 1万+
一、node环境 安装node.js，没有的可以在我的资源里下载 二、新建vue项目 安装vue脚手架 npm install -g vue-cli 用脚手架搭项目 vue init webpack-simple (项目名字) 　或　 vue init webpack (项目名字) 两者区别就是 vue init webpack-simple :可以理解为轻巧的，没有多余...
Ubuntu环境下Vue.js的安装与工程创建指南
- 执行`vue init webpack project-name`命令，其中`project-name`是新建项目的名称。 - 按照提示填写项目配置信息，比如项目描述、作者等，之后按照指引完成项目结构的搭建。 - 在项目根目录下，运行`npm run dev...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值