vue-cli脚手架构建vue3项目

最新推荐文章于 2023-10-18 16:14:47 发布
最新推荐文章于 2023-10-18 16:14:47 发布
阅读量510 收藏 4
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41950190/article/details/114873057
版权
  1. 安装node.js 版本在8v+ （可以去官网下载）
  2. 安装脚手架 npm install vue-cli -g
  3. 安装淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org（淘宝镜像会快一点，不安装也没关系）
  4. 开始创建项目 vue create '项目名称'
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
4. 运行项目

cd 项目名称 (进入项目根目录)
cnpm run serve (启动项目)

在这里插入图片描述
在这里插入图片描述

姥姥家的饭
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue3 脚手架搭建项目详细过程
zyf971020的博客
10-12 9918
Vue3 脚手架搭建项目详细过程及代码规范配置
vue-cli3脚手架搭建项目
jslcc的博客
08-29 1106
vue-cli3脚手架搭建项目
vue3脚手架搭建
最新发布
贝西奇谈
10-18 4137
Vue3CLI（脚手架）
创建vue3项目脚手架
gp_911014的博客
02-21 1651
Vite 是由 Vue 作者尤雨溪先生带领团队开发的一个构建工具，它利用浏览器原生支持 ES 模块的特点，极大提升了开发体验，自 2021 年 1 月份发布 2.0 版本以来，发展非常快，笔者也在第一时间参与贡献了一些文档和插件，并且在 2021 年期间，个人项目已经全面切换到 Vite ，公司业务也在 2021 年底开始使用 Vite 创建新项目，整体情况非常稳定，前景非常乐观。Lint 规则，用来代码检查，写 TypeScript 离不开 Lint ，可以根据自己喜好选择，也可以先选择默认，后面在。
vue-cli3项目结构解读
kalinux的博客
05-25 396
node_modules public 该文件夹用来存放静态资源，存放在此的东西不受打包影响，会原封不动的输出到dist文件夹中 server src .browserlistrc 用来对浏览器进行限制，规定什么样的浏览器能够将es6转为es5，类似vue cli2的.babelrc （来自于@vue/cli-plugin-babel） babel.config.js 是babel的配置文件 (来自于@vue/cli-plugin-babel) .eslintignore e...
Vue-脚手架的创建
qq_52998673的博客
11-05 917
Vue-脚手架的创建
vue-cli构建vue项目
soos的博客
09-13 670
第一步：在node.js官网下载node.js并安装。 第二步：安装vue-cli。 打开DOS控制台，进入都指定文件E:\vue-cli夹输入：npm install -g vue-cli进行安装（这里vue-cli是全局安装的进入不进入文件夹都可以）。 第三步：检查版本，看是否安装成功,在控制台输入vue -V，如果出现版本号则表示安装成功。 第四步：使用vue-cli初始化项目。
vue-cli脚手架-bulid下的配置文件
08-27
Vue-cli脚手架bulid下的配置文件是Vue.js开发过程中的一部分，主要用于创建和配置Vue.js项目。通过学习和掌握这些配置文件，可以帮助开发者更好地理解Vue.js项目的结构和工作原理，并且提高项目的开发效率和质量。 ...
详解vue-cli 脚手架项目-package.json
12-08
使用vue-cli脚手架新建的项目中，含有package.json。 package.json是npm的配置文件，里面设定了脚本以及项目依赖的库。 npm run dev 这样的命令就写在package.json里。 { "name": "vue-manage", // 项目名称 ...
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
01-19
用vue-cli构建了项目之后在webstorm开发，用npm run dev跑本地服务，经常修改之后在浏览器刷新没反应，偶尔才会有刷新，需要重新跑一遍npm run dev才会更新，这是怎么回事呢？ 解决方法 webstorm保存的时候会先保存...
vue-cli脚手架的.babelrc文件用法说明
10-14
`.babelrc` 文件是 Vue CLI 脚手架中的一个重要配置文件，用于定义 Babel 的转码规则和插件。Babel 是一个广泛使用的 JavaScript 编译器，它允许开发者使用 ES6+ 甚至实验性语言特性，然后将这些新特性转换为广泛...
vue-cli3-template：基于Vue-cli3建造的脚手架项目模板
01-31
项目介绍基于Vue-cli3建造的前端开发脚手架项目模板，主要包括以下内容：Webpack4.x性能调优配置，Vue.js全家桶，移动端vw适应，单元测试等功能，可以参考，欢迎大家围观指教！项目特点特征 巴别塔 VueRouter 威克斯...
Vue 3 脚手架搭建
Dily_Su的博客
05-18 1726
手把手带你创建属于自己的 vue3 脚手架 技术栈：vite、vue3、typescript、pinia、axios、eslint、prettier、element-plus、unplugin-auto-import、unplugin-vue-components、unplugin-icons
【Vue】使用Vue脚手架(vue-cli)构建Vue3项目
早睡早起长头发的博客
08-17 1926
一、利用cmd和vscode创建 二、利用cmd和webstorm创建
【vue3】06-vue的组件化开发-脚手架创建项目
SevgiliD的博客
05-10 925
Vue的组件化开发：组件化开发思想，注册组件的两种方式；脚手架的安装和使用；生成的项目目录结构解析
Vue3脚手架搭建（三）
sodakii的博客
09-26 657
使用ES6风格编码源码,定义变量使用let,定义常量使用const,使用export,import模块化。Props定义：提供默认值，使用type属性校验类型，使用props之前先检查prop是否存在。无特殊情况不允许使用原生API操作dom,谨慎使用this.$refs直接操作dom。指令缩写：都用指令缩写 (用 : 表示 v-bind: 和用 @ 表示 v-on:)。函数中统一使用_this=this来解决全局指向问题。使用计算 规避v-if和v-for用在一起。为v-for设置Key值。
vue3.0教程——搭建Vue脚手架【简化版】
weixin_51331210的博客
10-02 6111
🍣 🍥 🍙哈喽，大家好丫，你们的小郭子又来啦 ~ 今天来聊一聊Vue3的项目搭建问题。
Vue3：创建脚手架
孤安先生的博客，作者主站正在重构中，敬请期待！
11-18 492
Vue3 运行性能是 Vue2 的 1.5 倍。Vue3 支持 tree-shaking，可以进行按需编译，编译后的文件体积比 Vue2 更小。Vue3 提供更先进的功能，teleport、suspense 等。Vue3 对 TypeScript 的支持更友好，对大型前端应用的支持更好。Vue3 组合式 API 使应用中的功能代码更聚合，使组件间公共逻辑的抽取更容易。Vue3 在 2022年2页左右。使用 Proxy 代替 defineProperty 实现响应式。
vue判断用户是否登录，没有登录跳转登录页面
热门推荐
姥姥家的饭
07-03 3万+
在 main.js 中判断是否需要登录 router.beforeEach((to, from, next) => { if (to.matched.some(record => record.meta.requiresAuth)) { //这里判断用户是否登录，验证本地存储是否有token if (!localStorage.token) { // 判...
vue-cli脚手架
07-27
Vue-cli脚手架是Vue官方提供的一个工具，用于快速生成一个Vue项目的模板。它预先定义了项目的目录结构和基础代码，可以帮助开发者更快速地搭建一个Vue项目的框架。通过Vue-cli，开发者可以使用简单的命令完成项目...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值