vue2.0 之 douban (一)框架搭建 及 整体布局
2024-09-30 08:12:34
1.创建豆瓣项目
我们通过官方vue-cli初始化项目
vue init webpack douban
填写项目描述,作者,安装vue-router
初始化后,通过npm install安装依赖
cd douban
npm install
由于我们是做的移动端,所以在index.html里面加上meta
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
运行项目
npm run dev
2.布局
解压豆瓣app获得他的一些图片素材,拷入到src/assets/images目录里
在src下,新建了一个pages目录,存放每一个页面组件
在src下,新建了一个pages目录,存放每一个页面组件
index.js
import Vue from 'vue'
import Router from 'vue-router'
import Index from '../pages/Index' Vue.use(Router) export default new Router({
routes: [
{
path: '/',
name: 'Index',
component: Index
}
]
})
每一个组件的css我们通过less来编写,所有需要通过npm安装less插件
npm install less less-loader --save
使用less预处理器需要在页面添加 lang='less'
<style scoped lang="less"> </style>
安装 mint-ui 组件
npm install mint-ui --save
.
最新文章
- SQL 数字分割的字符串
- [转]oracle分析函数Rank, Dense_rank, row_number
- C语言常见类型占用字节数
- sujection重构
- PL/sql语法单元
- 中石油-高精度除法-java版
- python 操作excel 使用笔记
- C++学习44 格式化输出,C++输出格式控制
- Cadence Allegro导网表的错误问题解决
- tomcat 详解五 tomcat页面设置访问权限
- PDO 提供了三种不同的错误处理模式
- The Managed Metadata Service or Connection is currently not available
- python非转基因HTTP请求库--Requests: 让 HTTP 服务人类
- 【山东省选2008】郁闷的小J 平衡树Treap
- SimpleMembership续
- eclipse JVM 性能调优
- BFS GPLT L2-016 愿天下有情人都是失散多年的兄妹
- 判断socket连接是否失效
- Android使用腾讯浏览服务X5内核
- hdu 6208(后缀自动机、或者AC自动机