1. npm install stylus --save
  2. npm install stylus-loader --save
  3. 移动端一般采用rem布局方式
  4. Header组件里iconfont的使用和代码优化：在src/assets/styles目录下新建一个iconfont文件夹，把iconfont.css文件放到style目录之中
  5. 使用stylus定义变量：在styles目录下新建一个varibles.styl文件，把公用的样式放在这个文件之中  $bgColor = #00bcd4 ，之后就可以在项目里直接使用这个变量名了
  6. 像src/assets/styles引用文件目录过长问题解决办法，像@代表src一样，在配置项中给引用文件目录添加别名：打开：build目录下的webpack.base.conf.js，找到：alias，在@之后添加别名（通过webpack的配置对项目代码进行简化）
  7. 在修改webpack配置项之后，一定要重启服务器，不然会报错

项目Header组件的开发注意事项的更多相关文章

  1. 【vue】饿了么项目-header组件开发

    1.数据传递的理解 在App.vue中用到了header组件,首先注册组件 components: { 'v-header': header } 然后才能引用 <v-header :seller ...

  2. Android项目模块化/组件化开发（非原创）

    文章大纲 一.项目模块化初步介绍二.项目模块化的两种模式与比较三.大型项目模块化的演进四.项目模块化总结五.参考文章   一.项目模块化初步介绍 1. 前言 在Android开发中,随着项目的不断扩展 ...

  3. weex 项目开发（五）自定义 过滤函数 和 混合 及 自定义 Header 组件

    1.自定义  过滤函数 src / filters / index.js /** * 自定义 过滤函数 */ export function host (url) { if (!url) return ...

  4. 外卖app的header组件开发

    1.webpack框架创建 # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpa ...

  5. Android项目实战（四十八）：架构之组件化开发

    什么要组件化开发? 看一下普通项目的结构 , 一个项目下有多个Module(左侧图黑体目录),但是只有一个application,0个或多个library(在每个medel下的build.gradle ...

  6. 微信小程序入门与实战 常用组件API开发技巧项目实战*全

    第1章 什么是微信小程序? 第2章 小程序环境搭建与开发工具介绍 第3章 从一个简单的“欢迎“页面开始小程序之旅 第4章 第二个页面:新闻阅读列表 第5章 小程序的模板化与模块化 第6章 构建新闻详情 ...

  7. 企业门户（Portal）项目实施方略与开发指南

    <企业门户(Portal)项目实施方略与开发指南> 基本信息 作者: 郑文平    丛书名: 企业大型应用集成丛书 出版社:电子工业出版社 ISBN:9787121211843 上架时间: ...

  8. Webpack+Vue+ES6 前端组件化开发mobile-multi-page应用实战总结

    本文版权归博客园和作者吴双本人共同所有 转载和爬虫请注明原文地址 www.cnblogs.com/tdws 一.写在前面 项目上线有一段时间了,一个基于webpack+vue+ES6的手机端多页面应用 ...

  9. Android组件化开发的简单应用

    组件化开发的主要步骤: 一.新建Modules 1.新建Project,作为应用的主Module. 2.新建Module:"Common",类型选择"Android Li ...

随机推荐

  1. 炸弹人NABCD分析

    团队项目NABCD分析结果 N(Need 需求):现在安卓手游比较热门,所以我们想要编写这样一款软件应用于学生,让学生可以在课余时间放松心情,缓解学习压力. A (Approach 做法):使用Coc ...

  2. bug--注意Android编译打包--找不到某某类

    http://blog.csdn.net/mad1989/article/details/9142557 看到这篇 才解决问题= = 15,ClassNotFoundException: Didn't ...

  3. Internet History, Technology and Security (Week5.1)

    Week5 The Transport layer is built on the Internetwork layer and is what makes our network connectio ...

  4. windows多线程（八） 信号量Semaphore

    如果你看到了这里,我就认为你已经对掌握了有关关键段 CriticalSection.互斥量Mutex和事件Event有关的内容,所以最基本的东西就不再介绍了.如果没有掌握上面说的内容,可以看这里: 关 ...

  5. git bash使用（markdown版）

    前言 我是通过这个来学习的.个人愚笨,琢磨了半天,终于搞通了,醉了醉了,以前一直使用svn,用git确实有点水土不服.本文以如何使用git为主来展开,不涉及太多理论. git是分布式的版本管理.什么叫 ...

  6. three.js:Failed to execute 'texImage2D' on 'WebGLRenderingContext解决方案

    three.js加载图片时,出现Failed to execute 'texImage2D' on 'WebGLRenderingContext .Tainted canvases may not b ...

  7. IE下Userdata本地化存储

    这两天看了下Discuz x2发帖的实时保存机制,涉及到本地化存储,所以上网查了下,Firefox等支持HTML5的浏览器使用window.localStorage或window.sessionSto ...

  8. 【BZOJ1499】【NOI2005】瑰丽华尔兹（动态规划）

    [BZOJ1499]瑰丽华尔兹(动态规划) 题面 BZOJ 题解 先写部分分 设\(f[t][i][j]\)表示当前在\(t\)时刻,位置在\(i,j\)时走的最多的步数 这样子每一步要么停要么走 时 ...

  9. 【转】VMware虚拟机三种网络模式详解

    由于Linux目前很热门,越来越多的人在学习Linux,但是买一台服务放家里来学习,实在是很浪费.那么如何解决这个问题?虚拟机软件是很好的选择,常用的虚拟机软件有VMware Workstations ...

  10. metasploit出错信息：can't allocate memory

    出现不能分配内存的原因: 1.postgresql服务未启动 启动服务 service postgresql start 2.虚拟机内存分配过小,如:512M 将kali虚拟机的内存扩展到1G 出错图 ...