美文网首页
Vue学习-小白

Vue学习-小白

作者: 米臭了 | 来源:发表于2022-08-15 11:21 被阅读0次

前提是已经安装了npm和Vue以及脚手架vue-cli

1、创建项目

vue init webpack 项目名

2、进入项目文件夹

cd tab键

3、运行项目

npm run start

4、App.vue全局配置

此文件内的内容不会随路由改变而改变,通常导航条就写在这里
image.png

5、index.js 配置路由

routes对象内配置,一个大括号表示一个路由,path、name、component
path:对应路径
name:名
component:组件 * 需要去src/component文件夹下创建一个vue文件,把HelloWorld文件中的script内容复制过来改吧改吧

image.png

参考文件

https://laravelcode.cn/posts/37/vue-cli-was-introduced-to-bootstrap4
https://router.vuejs.org/zh/guide/essentials/nested-routes.html

相关文章

  • Vue学习-小白

    前提是已经安装了npm和Vue以及脚手架vue-cli 1、创建项目 vue init webpack 项目名 2...

  • Vue3.9打包后首页白屏

    作为前端小白,最近开始学习vue,安装的是目前最新版本的vue cli3.9.2,并且通过vue ui控制台界面创...

  • Vue 入门到实战课程

    Vue 入门到实战课程 说明 课程 VueCli3.0-小白入门 Vue2.0 小白入门教程 Vue 项目实战 在...

  • 小白的Vue学习之路

    第三章 Vue 组件&路由 定义Vue组件 什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们...

  • 小白的Vue学习之路

    第一章 Vue 初步认识 什么是Vue.js Vue.js 是目前最火的一个前端框架,React是最流行的一个前端...

  • vue.js开发前必备

    经过这几天自己初步学习vue基础的知识,想和大家分享一下自己,毕竟是小白,希望大家可以多多指教 首先vue基础从大...

  • Vue 学习笔记 -- 项目搭建

    Vue 学习笔记 -- 项目搭建 目前只是一个前端小白, 之前也只是工作需要粗略接触过AngularJS,对于前端...

  • react学习笔记

    公司最近要做react的项目,所以,小白继续学习中……整理笔记如下…… React 和 Vue的对比 模块化:从代...

  • 手动构建vue+webpack遇到的各种坑。。。

    最近由于项目需要,自己开始着手于vue+webpack的学习。作为前端的小白,自己在学习的路上走的太艰难,以下是我...

  • vue项目入门指南

    Vue小白拿到一个Vue项目,不知道从哪里下手,项目结构如下所示,它是用vue-cli创建,Vue-cli是Vue...

网友评论

      本文标题:Vue学习-小白

      本文链接:https://www.haomeiwen.com/subject/glpkgrtx.html