项目参考 nextJs-yicha

1. 采用方案

create-next-app、antd
(1)安装
npx create-next-app --example with-ant-design myApp

2. 样式加载方案

less + cssModule

3. 同时使用css和sass

// next.config.js

const withCSS = require('@zeit/next-css');

const withSass = require('@zeit/next-sass');

module.exports = {

  webpack(config, ...args) {

    config = withCSS().webpack(config, ...args);

    config = withSass().webpack(config, ...args);

  }

}

4. 公共头部方案

1. 设置一个公共组件 Layout

import Head from 'next/head';

export default ({children}) => (

  <div>

    <Head>

      <title>公共头部</title>

    </Head>

    {children}

    <footer></footer>

  </div>

)

2. 使用方法

import Layout from '....';

export default () => (

  <Layout>

    // content

  </Layout>

)

5. 设置icon，正在head自定义组件中添加favicon.ico

<link rel="icon" href="/static/favicon.ico"/>

6. 图片懒加载(lazysizes)

在layout里面进行引用

import 'lazysizes';

7. 请求跨域解决方案

用node重新起一个服务器作为中间层，通过node进行请求，得到数据后再把数据返回给客户端，参照server.js

nextJS使用注意事项的更多相关文章

  1. jQuery UI resizable使用注意事项、实时等比例拉伸及你不知道的技巧

    这篇文章总结的是我在使用resizable插件的过程中,遇到的问题及变通应用的奇思妙想. 一.resizable使用注意事项 以下是我在jsfiddle上写的测试demo:http://jsfiddl ...

  2. Windows Server 2012 NIC Teaming介绍及注意事项

    Windows Server 2012 NIC Teaming介绍及注意事项 转载自:http://www.it165.net/os/html/201303/4799.html Windows Ser ...

  3. TODO：Golang指针使用注意事项

    TODO:Golang指针使用注意事项 先来看简单的例子1: 输出: 1 1 例子2: 输出: 1 3 例子1是使用值传递,Add方法不会做任何改变:例子2是使用指针传递,会改变地址,从而改变地址. ...

  4. app开发外包注意事项，2017最新资讯

    我们见过很多创业者,栽在这app外包上.很多创业者对于app外包这件事情不是特别重视,以为将事情交给app外包公司就完事了,实际上不是的.无论是从选择app外包公司还是签订合同.售后维护等各方面都有许 ...

  5. favicon.ioc使用以及注意事项

    1.效果 2.使用引入方法 2.1 注意事项:(把图标命名为favicon.ico,并且放在根目录下,同时使用Link标签,多重保险) 浏览器默认使用根目录下的favicon.ico 图标(如果你并没 ...

  6. ORACLE分区表梳理系列（二）- 分区表日常维护及注意事项（红字需要留意）

    版权声明:本文发布于http://www.cnblogs.com/yumiko/,版权由Yumiko_sunny所有,欢迎转载.转载时,请在文章明显位置注明原文链接.若在未经作者同意的情况下,将本文内 ...

  7. 【原】Masonry+UIScrollView的使用注意事项

    [原]Masonry+UIScrollView的使用注意事项 本文转载请注明出处 —— polobymulberry-博客园 1.问题描述 我想实现的使用在一个UIScrollView依次添加三个UI ...

  8. 《连载 | 物联网框架ServerSuperIO教程》- 5.轮询通讯模式开发及注意事项。附：网友制作的类库说明（CHM）

    1.C#跨平台物联网通讯框架ServerSuperIO(SSIO)介绍 <连载 | 物联网框架ServerSuperIO教程>1.4种通讯模式机制. <连载 | 物联网框架Serve ...

  9. 《连载 | 物联网框架ServerSuperIO教程》- 6.并发通讯模式开发及注意事项

    1.C#跨平台物联网通讯框架ServerSuperIO(SSIO)介绍 <连载 | 物联网框架ServerSuperIO教程>1.4种通讯模式机制. <连载 | 物联网框架Serve ...

随机推荐

  1. TCP协议中的三次握手和四次挥手(图解)（转）

    转自:http://blog.csdn.net/whuslei/article/details/6667471 建立TCP需要三次握手才能建立,而断开连接则需要四次握手.整个过程如下图所示: 先来看看 ...

  2. Java的安全性如何理解

    Java取消了强大但又危险的指针,而代之以引用.由于指针可进行移动运算,指针可随便指向一个内存区域,而不管这个区域是否可用,这样做是危险的,因为原来这个内存地址可能存储着重要数据或者是其他程序运行所占 ...

  3. ftp的虚拟用户的使用

    虚拟用户原理 因为在linux之下,使用vsftp建立用户之后,默认使用ftp访问的时候,是会访问到对应的用户家目录.如果想多个用户同时访问某一个目录,同时对同一目录下有着不同的权限,比如部分用户只能 ...

  4. spring 结合 redis 例子 （转)

    好了费话不多说了,介绍下spring 结合redis是怎么操作数据的 这里我用了maven管理,由于简单嘛,依赖下包就行了..不用单独去依赖包,成了我的习惯 好了,下面是pom的代码 <proj ...

  5. 【leetcode】328. Odd Even Linked List

    题目如下: Given a singly linked list, group all odd nodes together followed by the even nodes. Please no ...

  6. 表格table隔行变色

    if($('.p03-s2').find('table').length >= 2) {$('table:last-child').css({'borderTop': 'none'});}if( ...

  7. Spring AOP 总结

    AOP的基础是Java动态代理 Java中代理的实现一般分为三种:JDK静态代理.JDK动态代理以及CGLIB动态代理. 静态代理: 代理类与被代理类实现同一个接口,在代理类中持有一个被代理对象的引用 ...

  8. go结构体上的函数

    go结构体上的函数 我们可以将一个方法和一个结构体关联: type Saiyan struct { Name string Power int } func (s *Saiyan) Super() { ...

  9. HDU - 1712 （分组背包模板）

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1712 题意:给你n个课程,每个课程有很多种学习方法,用的时间和取得的效果都不一样,现在你只有m天时间用来学 ...

  10. 使用Objective-C的+(void)initialize初始化static变量

    在<Objective C类方法load和initialize的区别>一文中,我介绍了Objective-C对待+(void)initialize和+(void)load两个方法在编译和执 ...