（1）node.js环境，安装npm
（2）在码云中创建私有库
（3）安装Git
（4）关联线下和线上的仓库，通过git clone命令，将线上仓库下载到本地
（5）安装Vue-CLI，最新的是3.0版本，具体安装和创建项目的方法可见官方文档
（6）将本地的代码推送到码云中
输入以下命令：
git add .
git commit -m "相关的备注内容"
git push注意add后面为点（.），表示添加所有文件
（1）在main.js文件中引入Vue Router：
import Vue from 'vue'
import App from './App'
import router from './router&#fig.productionTip = false/* eslint-disable no-new */
new Vue({el: '#app',router,components: { App },template: '<App/>'
})（2）在router路径下的index.js文件中，配置路由
import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/pages/home/Home'Vue.use(Router)export default new Router({routes: [{path: '/',name: 'Home',component: Home}],
})（3）App.vue中的路由视图
<template><div id="app"><!-- 显示的是当前路由地址所对应的内容 --><router-view/></div>
</template><script>export default {name: 'App'}
</script>
<template><div><div class="home">home</div><router-link to="/home">Home</router-link></div>
</template>使用route-link进行页面间的跳转。
因为template只能向外暴露一个元素，所以需要在外层包一个div
（1）在index.html文件中，进行移动端配置
<!DOCTYPE html>
<html><head><meta charset="utf-8"><!-- 进行移动端适配 --><meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"><title>qunaer-project</title></head><body><div id="app"></div><!-- built files will be auto injected --></body>
</html>（2）npm安装插件
npm install vue-awesome-swiper@2.6.7 --save--save命令可以将组件名称保存到package.json文件中的依赖包中，便于复用代码时，通过npm install直接安装
"dependencies": {"vue": "^2.5.2","vue-awesome-swiper": "^2.6.7","vue-router": "^3.0.1","vuex": "^3.1.1"}
本文发布于:2024-01-29 07:21:41，感谢您对本站的认可！
本文链接：https://www.4u4v.net/it/170648410313642.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
| 留言与评论（共有 0 条评论） |
