2. vue 工程创建

已于 2024-03-03 20:03:34 修改
阅读量454 收藏 10
点赞数 8
分类专栏： vue 文章标签： vue.js 前端 javascript
于 2024-03-03 19:03:56 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43476824/article/details/136434276
版权

1. 基于 vite创建

  官方文档: https://v3.cn.vuejs.org/guide/installation.html#vite

  vite官网: https://vitejs.cn

  使用vite创建的优势： 

  • 开发环境中，无需打包操作，可快速的冷启动。
  • 轻量快速的热重载(HMR)。
  • 真正的按需编译，不再等待整个应用编译完成。

创建过程：

2.1 创建工程 

         命令：npm create vue@latetes

2.2 使用vscode打开工程

 2.3 加载依赖

 命令npm i  (相当于java中的maven查找依赖的jar）

2.4 开发运行

    命令：npm run dev

不听话的小耳朵
关注
  • 8
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue.js教程-Vue项目的目录结构和.vue文件的构成
CoderHqf的博客
07-28 1万+
Vue.js教程-Vue项目的目录结构和.vue文件的构成前言Vue项目的目录结构(Vue-cli3/4版本).vue文件的构成Html区域(template)script区域export default区域style区域总结 前言 本章介绍vue项目的目录结构和一个.vue文件的三部分，分别是template、script和style。 上一篇文章说到为什么同样都是.vue文件，为什么存在于不同的文件夹下，下面先解释一下目录结构。 因为Vue属于单页面开发方式，构成这个页面的元素就是组件，各个小组件组成
2.Vue创建工程-组件通信-Vue-router
01-08
文章目录安装 Node 和 NPMvue cli创建工程创建工程创建空项目安装vue导入vue.jsnpm安装vue学习入门语法组件化1.全局组件2.组件的复用3.局部组件4.组件通信1.props（父向子传递）2.props验证3.动态静态传递4.子向父的...
vue3创建vue2.x项目
10-07 1450
文章目录创建项目添加插件解决跨域问题 因为一些原因更新了node，再次安装vue时，莫名的就vue3了。 好吧，但是以前的项目还是vue2的，所以顺便尝试了下vue3创建vue2项目。 创建项目 首先是创建，以前是使用vue init创建，现在是vue create，然后在创建时，可以选择2还是3；如果选择3还有一些其它选项（比如是否安装vue-router,axios等）。 添加插件 一般来说vue-router和axios是要添加的；也很简单，在项目下面直接使用sudo vue add router、s
创建 Vue 工程的3种方法
学习笔记
05-14 2214
可以使用以下3种方法创建并初始化一个Vue app： 方法1. 从CDN 加载 Vue CDN：Content Delivery Network 内容分发网络，使用脚本从CND加载Vue，步骤如下： index.html 中增加脚本：<script src="https://unpkg.com/vue@3"></script> （参考网页: https://vuejs.org/guide/quick-start.html ） <!DOCTYPE html> <
【保姆级】如何创建一个Vue工程
今天你学Java了吗
06-10 2219
本文介绍如何创建一个Vue工程，从前置下载操作到一步步选择，最终成功创建一个Vue工程，使用到Vue-Cli，文中每一步都有图例对照，并有报错后的应对方法，方便小白成功创建一个Vue工程，堪称保姆级教程，建议收藏
.Vue创建简单的登录页面
ZSR1126的博客
12-27 2120
el-input placeholder="请输入密码" v-model="pwd" show-password class="input_style"></el-input><el-input placeholder="请输入用户名" v-model="name" clearable class="input_style"></el-input>1、创建登录界面和主页 2、配置路由 3、配置main.js 4、配置App.vue 5、登录界面 6、主页面。一、创建登录界面和主页。
Vue中main.js、App.vue和index.html
看博客不点赞打shi你
02-23 5467
初始化的Vue项目的时候，最先接触到的就是main.js，App.vue，index.html这三个文件。 main.js是入口文件，主要作用是初始化vue实例，并引入所需插件 App.vue是主组件，所有页面都是在App.vue下进行切换，可以理解为所有的路由都是App.vue的子组件 index.html是页面的入口文件，里面包含一个id为app挂载点，main.js中定义的Vue根实例就会挂载到该挂载点上 打开网页的时候，页面Title是index.html中定义的Title，而正文部分是App..
Vue3、Vue2项目创建
W__J__J的博客
12-12 1435
Vue项目创建
Vue3 —— 创建 Vue3.0 工程
HuoZhiyan 的博客
07-01 2157
Vue3.0 工程的创建及简单分析，内含扩展工具安装包。
vue2.x+electron创建桌面程序
http://xueshuai.top
05-25 3099
首先搭建vue2.x项目 搭建完成之后可以通过浏览器 http://localhost:8080/ 访问 然后在根目录下配置 vue.config.js 来解决打包静态资源页面空白 module.exports = { publicPath: "./",//配置静态资源 } 然后在根目录下安装 electron //官网提供 npm i --save-dev electron //由于上面是通过国外安装，可能会报错，出现报错可以试试国内镜像 cnpm i --save-dev e
创建Vue工程常用的命令
做笔记\记录遇到的程序bug
12-21 2266
创建一个vue项目的步骤 1、创建一个名称为myapp的工程 vue init webpack myapp 2、进入工程目录 cd myapp 3、安装vue-router npm install vue-router --save-dev 4、安装element -ui npm i element -ui -S 5、安装依赖 npm install 6、安装SASS加载器 cnpm install sass-loader node -sass --save-dev 7
Vue.js学习工程.zip
12-21
Vue.js还有生命周期钩子，这些是在组件创建、更新、销毁过程中调用的函数，例如`created`、`mounted`、`updated`等。这些钩子可以帮助开发者在组件的不同阶段执行特定操作。在"LearnVueJS-master"的代码中，你可以...
vue下载及创建vue工程
11-30
Vue 下载及创建 Vue 工程 Vue 是一个流行的前端框架，由 Evan You 于 2014 年创建，旨在简化 Web 应用程序的开发过程。以下是关于 Vue 下载及创建 Vue 工程的知识点： 安装 Node.js Node.js 是一个 JavaScript ...
Comp.Vue
03-16
"Comp.Vue" 是一个基于 Vue.js 框架的项目，从描述中我们可以看出，这是一个涉及前端开发的工程，其中包含了多个关键步骤和工具，主要用于构建和优化应用。让我们详细了解一下这些知识点： 1. **Vue.js**：Vue.js ...
vue3【详解】单文件组件 SFC（含SFC的优点、缺点、使用场景、原理、使用预处理器、＜script setup＞语法详解、资源拆分）
朝阳39的博客
07-16 594
自定义指令必须遵循命名规范（自定义指令名的首字母必须是v，后续跟首字母大写的自定义指令名称 ）// 在元素上做些操作 } } < template > < h1 v-my-directive > This is a Heading const。
【Vue】 style中的scoped
DX390609的博客
07-15 166
在vue文件中的style标签上，有一个特殊的属性：scoped。当一个style标签拥有scoped属性时，它的CSS样式就只能作用于当前的组件，通过该属性，可以使得组件之间的样式不互相污染。
docker将Java、vue、nginx打进镜像（涉及容器打成镜像）
qq_37752382的博客
07-15 557
按照上文拉取centos7，然后将需要的东西直接打进脚本，这样最简单，但是在拉取过程中，初始镜像contos7安装nginx需要安装一些工具包，拉取的时候报错了，原因还是在镜像源上，并且还想在上面装一些工具，另外创建容器不应该在里面做很多初始化的东西，每次更新业务包就行，4）准备文件完成后执行下面的就行（如果配置文件不对，比如nginx的配置等先进入镜像手动调整好，没问题了，再删除掉容器和镜像重新制作镜像即可）本文不讲安装docker,安装好安装，镜像源稍微麻烦点。1）生成镜像并创建容器。
vuejs v-for和v-if同时使用报变量未定义
业余程序猿
07-14 320
vue3中v-if优先级高，v-if使用v-for循环体数据时数据还未加载，就报未定义了。vue2中v-for优先级高，同时使用v-if可以直接使用v-for的循环体数据。无论时vue2还是3，官方都不建议两者一起使用，建议通过template嵌套。vue3和vue2 v-if和v-for同时使用时渲染优先级变了。查了下官方文档才找到问题所在。风格指南 — Vue.js。
vue3 选项式生命周期API 和 组合式生命周期API 执行先后顺序
最新发布
shengmeshi的博客
07-17 136
vue3 选项式生命周期API 和 组合式生命周期API 执行先后顺序
1.Vuex2.Vue Router3.Element UI4.Axios5.Vue CLI这些框架之间的关系
06-12
5. Vue CLI是Vue.js的官方脚手架工具，用于快速创建Vue.js应用程序的基础工程结构、配置构建工具和开发环境。 这些框架之间没有直接的依赖关系，但是它们可以一起使用，互相协作，提高Vue.js应用程序的开发效率和...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值