前端工程化-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中也会自动填写。

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

相关推荐
xiaofeichaichai15 小时前
Webpack
前端·webpack·node.js
问心无愧051315 小时前
ctf show web入门111
android·前端·笔记
唐某人丶15 小时前
模型越来越强,我们还需要 Agent 工程吗?—— 从价值重估到 Harness 实践
前端·agent·ai编程
智码看视界16 小时前
现代Web开发基础:全栈工程师的起航点
前端·后端·c5全栈
JS菌16 小时前
手写一个 AI Agent 全栈项目:从沙箱执行到子智能体的完整实现
前端·人工智能·后端
excel17 小时前
HLS TS 文件损坏的元凶:Git 提交与拉取
前端
Aphasia31117 小时前
https连接传输流程
前端·面试
徐小夕17 小时前
万字长文!千万级文档 RAG 知识库系统落地实践
前端·算法·github
梦梦代码精17 小时前
2026年PHP开源商城系统实测对比:架构、多商户、商用授权,谁才是真·省心?
vue.js·docker·架构·开源·代码规范