VUE学习笔记（一）—安装vue-cli和创建项目

最新推荐文章于 2024-04-18 13:22:10 发布
最新推荐文章于 2024-04-18 13:22:10 发布
阅读量223 收藏
点赞数
分类专栏： VUE vue学习笔记 文章标签： vue vue-cli
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sueRimn/article/details/83827234
版权

Github：sueRimn

1.cmd打开控制台进行创建项目

（1）全局安装脚手架

在命令行输入：npm install vue-cli -g

（2）初始化项目

继续输入：vue init webpack myvue(myvue是我取的项目名，根据个人需要进行设置)，然后一路enter就行，默认就是yes

 

（3）进入项目目录

项目初始化完成后继续输入：cd myvue (myvue是初始化设置的项目名）

（4）安装依赖

输入：npm install

（5）运行

输入：npm run dev

赋值所给的服务器地址在网页上就能打开看到运行结果了。

生成的项目目录如下：

DebJane
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue-cli安装与项目新建
YUAN_YONG_的博客
07-07 305
Vue脚手架安装步骤 1.首先我们去nodejs官网下载nodejs：https://nodejs.org/en/download/ 2.其次 去下载一个cnpm （注释：淘宝npm镜像，这个是阿里把外国的npm服务器搬到我们中国来了，用淘宝镜像npm下载一些配置文件会更快一些） 操作如下：电脑右下角 window输入cmd， 把 npm install -g cnpm --registry=https://registry.npm.taobao.org 复制到cmd里面去就可以拉。 3.安装vue文件
Vue 学习笔记（4）Vue-cli4 项目搭建 + 目录结构 + 项目打包、部署
最新发布
2401_84435739的博客
04-29 685
为了帮助大家更好温习重点知识、更高效的准备面试，特别整理了《前端工程师面试手册》电子稿文件。内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目，涵盖了初中级前端技术点。前端面试题汇总开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】JavaScript性能linux。
VueCli安装以及如何创建一个vue项目
qq_48770086的博客
05-26 225
VueCli安装以及如何创建一个vue项目
Vue-Cli(脚手架)安装及如何创建Vue-Cli项目-保姆级别教程,手把手教会你
热门推荐
m0_72568513的博客
06-09 2万+
快速创建 Vue.js 项目的向导式用户界面：我们只需要按照界面上的步骤一步步操作，就可以快速创建一个 Vue.js 项目。支持自定义配置：Vue CLI 提供了多种配置选项，开发者可以根据自己的需求进行选择和配置。支持插件扩展：Vue CLI 支持插件化扩展，开发者可以根据需要安装插件，例如路由、状态管理等。支持开箱即用的工具集成：Vue CLI 集成了很多实用的工具，例如 Babel、Webpack、ESLint 等。
Vue-Cli安装和配置（全）
qq_44709970的博客
02-21 4186
安装、配置、淘宝镜像、可能出现的问题
【vue】vue-cli脚手架安装和vue环境搭建
weixin_53950583的博客
04-16 1109
一，安装vue-cli 1，安装node环境 官方地址：https://nodejs.org/zh-cn/ 2，使用cmd安装全局安装webpack npm i webpack -g 3，全局安装vue-cli npm i vue-cli -g 查看安装版本号 vue -V 4，搭建项目环境 cd 到想要存放项目的文件夹 或者直接在文价夹打开cmd vue init webpack myblog（项目名，不要出现大写字母） 然后会弹出来一些选项 ? Project name myblog
Vue学习笔记进阶篇之vue-cli安装及介绍
12-08
全局安装vue-cli npm install -g vue-cli 当然了，要想使用npm工具，就必须安装Node.js，node.js的安装方法这里就不做介绍了。 安装完成后，在终端输入以下命令, 可以查看vue的版本：vue -V 输入以下命令，可以...
Vue学习笔记进阶篇之vue-router安装及使用方法
12-03
在安装 Vue Router 时，首先确保你已经使用 vue-cli 创建了一个项目。进入项目目录，例如 `my-demo1`，在终端中运行 `npm install vue-router --save` 命令。`--save` 参数会将 vue-router 添加到 `package.json` ...
Vue 前端小白了解并运用Vue3 + Vite 及 Vue-cli 4项目搭建_vue3 vite vue-cli-service(1)
m0_60750088的博客
04-18 370
更新更快更强！Performance：性能比 vue2.x 块 1.2 ～ 2 倍Tree shaking support：支持按需编译，体积更小Composition API：组合 API，类似 React HooksCustom Renderer API：暴露了自定义渲染 APIFragment，Teleport（Protal），Suspense：新增三个组件Better TypeScript support：更好的支持 TS让开发更简单！
vue-cli安装和构建项目
qq_62881798的博客
09-26 3252
vue-cli是vue.js的脚手架，用于自动生成vue.js+webpack的项目模板。xxx 为自己创建项目的名称必须先安装vue,vue-cli，webpack，node等一些必要的环境*.vue 文件，是一个自定义的文件类型，用类似HTML的语法描述一个Vue组件。每个.vue文件包含三种类型的顶级语言块 , 和 。这三个部分分别代表了 html,js,css。
用npm安装vue和vue-cli,并使用webpack创建项目的方法
12-12
一、npm 版本需要大于 3.0，如果低于此版本需要升级它： # 查看版本 $ npm -v 2.3.0 #升级 npm cnpm install npm -g 二、在用 Vue.js 构建大型应用时推荐使用 NPM 安装： # 最新稳定版 $ cnpm install vue 三、Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。 # 全局安装 vue-cli $ cnpm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my-project # 这里需要进行一些配置，默认回车即可
VueCLI的安装与Vue项目创建
weixin_42980389的博客
02-19 61
node下载地址：https://nodejs.org/zh-cn/ 安装一路next 打开CMD窗口，执行 node -v 查看node版本 打开CMD窗口，执行 npm -v 查看npm版本 打开CMD窗口，执行 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装cnpm 打开CMD窗口，执行 npm i -g webpack -g 安装webpack框架 打开CMD窗口，执行 npm i -g webpack-cli -.
【CSDN软件工程师能力认证学习精选】vue.js 三种方式安装(vue-cli)
CSDN高校俱乐部官方博客
02-26 2225
CSDN软件工程师能力认证（以下简称C系列认证）是由中国软件开发者网CSDN制定并推出的一个能力认证标准。C系列认证历经近一年的实际线下调研、考察、迭代、测试，并梳理出软件工程师开发过程中所需的各项技术技能，结合企业招聘需求和人才应聘痛点，基于公开、透明、公正的原则，甑别人才时确保真实业务场景、全部上机实操、所有过程留痕、存档不可篡改。 我们每天将都会精选CSDN站内技术文章供大家学习，帮助大家系统化学习IT技术。 Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web .
vue-element-admin 安装依赖 npm install 报错ERESOLVE unable to resolve dependency tree解决方案
LXYDSF的博客
02-13 2812
vue-element-admin 安装依赖 npm install 报错ERESOLVE unable to resolve dependency tree解决方案
npm run dev 后报错 cross-env BABEL_ENV-developent webpack-dev-server 的解决
铁锤妹妹的博客
01-19 8244
报错信息 问题原因： 因为之前安装依赖的时候，有些依赖不是 -g安装的，这样的话依赖就存在于当前的文件夹 当你换文件夹的时候，这些依赖就用不了了 -g的话是全局安装，这样不管文件夹在哪都可以用到 解决思路： 首先安装时候需要-g，因为webpack-dev-server是全局的。 说一下“cross-env NODE_ENV=demo webpack-dev-server --open --config ”这句话。从cross-env也可以看出来webpack-dev-server是全局的，因为cross-
启动vue-element-admin 安装npm install报错npm ERR! code 128npm ERR! An unknown git error occurre
qq_40834643的博客
02-02 3187
npm ERR! code 128 npm ERR! An unknown git error occurred npm ERR! command git --no-replace-objects ls-remote ssh://git@github.com/nhn/raphael.git npm ERR! git@github.com: Permission denied (publickey). npm ERR! fatal: Could not read from remote repository.
安装运行vue-element-admin的报错问题-解决办法
qq_42376600的博客
11-20 1万+
安装运行vue-element-admin的报错问题 解决办法
Vue创建新项目时出现npm ERR! code ENOENT错误的解决办法
zhzjn的博客
12-11 8645
最终发现，我们之所以在命令提示符中的npm命令和VS Code中的npm命令出现npm ERR code ENOENT错误只是因为文件夹在错的文件夹中进行npm命令罢了，平时一定多细心。我们也可以在VS Code中打开我们cmd的文件夹查看（打开这个文件夹就是错误的，应该打开它内部创建的项目名文件夹！记住你创建的项目名称，到时候需要进入这个文件夹npm install。如果按之前的直接npm install的话 会出现err错误，现在我们打开cmd文件夹中的项目文件夹。最简单的就是需要cd 你的项目名。
Vue学习笔记：从环境搭建到项目实战
- 安装Vue CLI（命令行工具），这是一个脚手架，用于快速创建和初始化Vue项目。全局安装命令为`npminstall -g vue-cli`，然后通过`vue init webpack vue-demo`创建一个名为vue-demo的新项目。 3. **Vue基础入门**...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值