vue3造轮子 ————使用vite搭建官网-1

全局安装 create-vite-app

yarn global add [email protected]或者npm i -g [email protected]

进入想要的目录

cva gulu-ui-1或者create-vite-app gulu-ui-1

//其中 gulu-ui-1 可以改为任意名称

再运行命令行提示三行代码

 ``` 

        cd gulu-ui 

        npm install (or `yarn`) 

        npm run dev (or `yarn dev`) 

 ```

安装并初始化vue-router

npm info vue-router versions//查看vue-router版本号

yarn add vue-router@找到上面最新版本号安装

接下来分4步走

1.新建history对象

2.新建router对象

为完整代码

3.app.use(router)    //使用vue-router

// createApp(App).mount('#app')  //这一行是原来的代码

const app = createApp(App)

app.use(router)  //创建router    一行代码变三行

app.mount('#app')

4添加router-view 和router-link

引入scss报错

引入scss报错解决方法

遇到的问题——解决（谷歌 发现人家说需要重新运行 就想着试一试 居然成功了）

解决方法如下 只保留这些 其它的删了也行

点击logo 隐藏asside这个模块

思路 声明一个函数来显示隐藏 （注意 由于它是组件 所以它需要在app父组件中声明  声明用provide ----这个声明了之后 不管多少级后代都可以访问到它   子组件用inject()来接收）