前端工程化-vue项目开发流程

vue项目创建参考该文:

前端工程化-vue项目创建-CSDN博客

组件就是页面的意思;

默认的App.vue根组件如下图

我们可以修改为如下图所示,注意script的选择,

<html>中的标签,此处是放在<template>中,其余两项一样。 一个组件(页面)包含三项。

热部署:在不停止程序、不刷新页面的情况下,修改了App.vue中的代码,网页中http://localhost:9000/#/会自动展示。

App.vue中的script中使用export,在main.js中就可以使用import。

一、自定义组件

在自定义的组件中,<template>中,一定要使用布局标签<div>

在views文件中创建自定义组件,注意组件名必须是以View结尾,且扩展名为.vue。

二、在根组件App.vue中引入自定义组件

根组件中,标签中,按照自定义组件的名称写标签,会自动补全。

script中也会自动填写。

引入两个自定义组件的案例:

相关推荐
程序视点32 分钟前
Escrcpy 3.0投屏控制软件使用教程:无线/有线连接+虚拟显示功能详解
前端·后端
silent_missile37 分钟前
element-plus穿梭框transfer的调整
前端·javascript·vue.js
专注VB编程开发20年44 分钟前
OpenXml、NPOI、EPPlus、Spire.Office组件对EXCEL ole对象附件的支持
前端·.net·excel·spire.office·npoi·openxml·spire.excel
古蓬莱掌管玉米的神1 小时前
coze娱乐ai换脸
前端
GIS之路1 小时前
GeoTools 开发合集(全)
前端
咖啡の猫1 小时前
Shell脚本-嵌套循环应用案例
前端·chrome
一点一木1 小时前
使用现代 <img> 元素实现完美图片效果(2025 深度实战版)
前端·css·html
萌萌哒草头将军2 小时前
🚀🚀🚀 告别复制粘贴,这个高效的 Vite 插件让我摸鱼🐟时间更充足了!
前端·vite·trae
布列瑟农的星空2 小时前
大话设计模式——关注点分离原则下的事件处理
前端·后端·架构
山有木兮木有枝_2 小时前
node文章生成器
javascript·node.js