NodeJs与Vue（安装与父子联动）

一、创建项目

1.以管理员权限进入文件cmd

可以先试试直接在文件导航栏输入cmd会省事一些

1.1 管理员权限

在搜索栏搜索终端（或者cmd）找到终端后右键以管理员权限运行

输入你的盘

D:

cd 位置

想用HbuilderX的内部终端，请使用管理员权限运行HbuilderX

2.输入npm init vue@latest

3.输入项目名称，不要中文

4.按左右选择是否，请根据个人需要

5.按顺序输入：

npm run dev用于产生链接，相当于Tomcat

在HbuilderX中可以选择运行，就不需要每次都打开cmd了

6.按住Ctrl+左键链接

出现这个则已完成

中途出现错误通常是路径有中文名或者没给管理员权限

7. 导入项目（需要导入到创建的项目级文件，否则无法运行）

二、在views文件夹中使用可变的script setup 实现页面可变（父子联动）

<template>
	<div class="about">
		<h1 @click="clickme()">{
  
  {num}}</h1>
		<h2 v-if="flag">真是个天才</h2>
		<ul>
			<li v-for="item in list">{
  
  {item}}</li>
		</ul>
	</div>
	<!-- 默认导出 -->
	<TheWelcome message='message'></TheWelcome>
	<!-- 不加冒号则使用"="右边的值，加了则使用本文档定义的值 -->
</template>

<style>
	@media (min-width: 1024px) {
		.about {
			min-height: 100vh;
			display: flex;
			align-items: center;
		}
	}
</style