vue搭建app, M端项目流程
思路:安装sass预处理嵌套css,flex布局,flexible手机淘宝适配和fastclick移动300s延迟
打开cmd,使用命令行
1.切换盘符:e:
2.使用vue建立一个项目,具体请看我的随笔博客,vue安装错误详情这一篇
3.打开这个项目:cd my-project, 执行npm命令
4.安装sass预处理
a,全局安装 vue-cli 输入: npm install --global vue-cli
b , 创建一个基于 webpack 模板的新项目 输入: vue init webpack my-project
c , 安装依赖 输入:npm install
为了使用sass,我们需要安装sass的依赖包
输入:npm install --save-dev sass-loader //sass-loader依赖于node-sass
输入:npm install --save-dev node-sass
d, 在asset/css目录下,引入mixin.scss和style.scss文件
在main.js中引入,import axios from 'axios'
import store from './store'
import 'lib-flexible'
import FastClick from 'fastclick'
使用npm安装 axios,lib-flexible,fastclick
使用px2rem-loader自动将css中的px转换成rem
安装px2rem-loader 输入: npm install px2rem-loader --save-dev
5.修改style标签
打开src目录下的components目录中的Hello.vue文件。
然后修改 style标签如下
<style lang="sass">
引用sass/scss 文件
举个例子 @import "./common/scss/mixin";
6.然后运行项目
输入:npm run dev
vue搭建app, M端项目流程的更多相关文章
- 【转】python+django+vue搭建前后端分离项目
https://www.cnblogs.com/zhixi/p/9996832.html 以前一直是做基于PHP或JAVA的前后端分离开发,最近跟着python风搭建了一个基于django的前后端分享 ...
- python+django+vue搭建前后端分离项目
以前一直是做基于PHP或JAVA的前后端分离开发,最近跟着python风搭建了一个基于django的前后端分享项目 准备工作:IDE,[JetBrains PyCharm2018][webpack 3 ...
- Vue 简单的总结四(项目流程,DIY脚手架、vue-cli的使用)
项目流程 1.下载 cdn 2.引包 vue-router依赖vue vue-router.js 3.如果是模块化机制 Vue.use(vue-router) 4.创建示例 let Home = {/ ...
- vue搭建环境并创建项目
1.>npm install @vue/cli -g 2.创建项目A a.>vue ui b.在弹出的管理界面创建项目 或 a.npm install -g @vue/cli-init b ...
- Django+vue在腾讯云上搭建前后端分离项目
最近打算用Django+vue搭建一个个人主站,在此记录一下搭建项目的整个过程. 一 开发环境: 腾讯云Centos 7 Python 3.7 Django ...
- 「开源」SpringCloud+vue搭建的商城项目
最近在研究SpringCloud,看到一个基于SpringCloud+vue搭建的模拟商城项目.用来辅助学习SpringCloud企业级开发还是很有帮助的.强烈推荐!! 源码地址在最后. spring ...
- day97:MoFang:移动端APP开发准备&移动端项目搭建&APICloud前端框架
目录 1.移动端开发相关概念 1.APP类型 2.移动端屏幕介绍 3.移动端自适配方案 4.元信息(meta) 2.APP开发准备 1.注册APPCLoud账号 2.下载APP开发编辑器 3.下载AP ...
- 从零开始搭建vue移动端项目到上线的步骤
初始化项目 1.在安装了node.js的前提下,使用以下命令 npm install --g vue-cli 2.在将要构建项目的目录下 vue init webpack myproject(项目目录 ...
- vue.js+koa2项目实战(四)搭建koa2服务端
搭建koa2服务端 安装两个版本的koa 一.版本安装 1.安装 koa1 npm install koa -g 注:必须安装到全局 2.安装 koa2 npm install koa@2 -g 二. ...
随机推荐
- mysql-笔记-函数
如果不指定:sql-mode=ignore_space ,函数名与后面的括号之前不能有空格
- P2522 [HAOI2011]Problem b (莫比乌斯反演)
题目 P2522 [HAOI2011]Problem b 解析: 具体推导过程同P3455 [POI2007]ZAP-Queries 不同的是,这个题求的是\(\sum_{i=a}^b\sum_{j= ...
- <el-upload></el-upload>组件上传图片到七牛云
[01]搭建好页面结构.定义数据与接口 <el-upload method="post" ref="upload" :action="domai ...
- 【MyBatis】Mapper XML 文件
Mapper XML文件 MyBatis 的真正强大在于它的映射语句,也是它的魔力所在.由于它的异常强大,映射器的 XML 文件就显得相对简单.如果拿它跟具有相同功能的 JDBC 代码进行对比,你会立 ...
- HEOI2019游记
Day-x 菜死了. Day-1 上午准备出发了,外面的**鸟一直在叫. 咕咕咕(大雾 随后和高一的一块去火车站出发. 火车上先是和\(wjh\)聊闲天,然后开始讨论题. 然后\(wjh\)就随手出题 ...
- 洛谷P5155 [USACO18DEC]Balance Beam(期望,凸包)
你以为它是一个期望dp,其实它是一个凸包哒! 设平衡木长度为\(L\),把向右走平衡木那个式子写一下: \[dp[i]=\frac{dp[i+1]+dp[i-1]}{2}\] 然后会发现这是一个等差数 ...
- CF1157B-Long Number题解
原题地址 题目大意:有一个\(n\)位数,其中的数字只有\(1\)~\(9\),不包括\(0\),每个\(1\)~\(9\)的数字有一个映射,映射也在\(1\)~\(9\)中,现在我们可以对这个\(n ...
- 【学习笔记】TensorFlow
1. tf.Graph().as_default() 的作用 首先看官网上的解释: 再看博主 Joanna-In-Hdu&Hust 对此比较通俗易懂的解释(https://www.cnblog ...
- 把xml数据直接插入到sqlserver数据库
存储过程: ALTER proc [ali].[ins_冻结金额表] @xmldoc varchar(max), ) as declare @idoc int exec sp_xml_prepared ...
- minikube是什么
最近在学习Kubernetes,需要再本地搭建换一个minikube的环境 搭建好之后我们查看节点: lideMacBook-Pro:~ liyuanhong$ kubectl get node NA ...