开发前准备
2021-06-19 本文已影响0人
一杯清凉的水
删掉多余代码：
src/App.vue：
<image>、<style>
删掉src/components文件夹，新增src/pages文件夹代替，
在pages下创建 home -- Home.vue
<template>
<div>
hello
</div>
</template>
<script>
export default {
name: 'Home'
}
</script>
<style>
</style>
更改src/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
},
]
})
更改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">
<!--保证页面1:1比例显示，且不可缩放-->
<title>travel</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放
统一所有浏览器初始化样式：
在src/assets/styles/引入reset.css，并在src/main.js导入
import './assets/styles/reset.css'
用于解决一像素边框问题：
在src/assets/styles/引入border.css，并在src/main.js导入
import './assets/styles/border.css'
解决移动端 click 事件延时300ms，速度缓慢问题
$ npm install fastclick --save
src/main.js导入
import fastClick from 'fastclick'
fastClick.attach(document.body)
在https://www.iconfont.cn/
注册一个项目
