3回答

Jokcy

2019-07-30

看你的代码好像没什么问题，这样，你直接获取getConfig()的返回值，也就是 const config = getConfig()，然后打印config看看

0

0

AngleYan

提问者

2019-07-28

config文件：

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

const configs = {
// 编译文件的输出目录
distDir: 'dest',
// 是否给每个路由生成Etag
generateEtags: true,
// 页面内容缓存配置
onDemandEntries: {
// 内容在内存中缓存的时长（ms）
maxInactiveAge: 25 * 1000,
// 同时缓存多少个页面
pagesBufferLength: 2,
},
// 在pages目录下那种后缀的文件会被认为是页面
pageExtensions: ['jsx', 'js'],
// 配置buildId
generateBuildId: async () => {
if (process.env.YOUR_BUILD_ID) {
return process.env.YOUR_BUILD_ID
}

// 返回null使用默认的unique id
return null
},
// 手动修改webpack config
webpack(config, options) {
return config
},
// 修改webpackDevMiddleware配置
webpackDevMiddleware: config => {
return config
},
// 可以在页面上通过 procsess.env.customKey 获取 value
env: {
customKey: 'value',
},
// 下面两个要通过 'next/config' 来读取
// 只有在服务端渲染时才会获取的配置
serverRuntimeConfig: {
mySecret: 'secret',
secondSecret: process.env.SECOND_SECRET,
},
// 在服务端渲染和客户端渲染都可获取的配置
publicRuntimeConfig: {
staticFolder: '/static',
},
}

if(typeof require!=='undefined'){
require.extensions['.css'] = file=>{}
}
//如果引用多个包，这里可以连环调用eg：withLess（withCss({})）
module.exports = withCss(
{
distDir: 'build'                                                // 这里配置了之后才会生效
}
);

a.js文件：

/**
 * withRouter可以往子组件传递父组件router的porps
 */
import { withRouter } from 'next/router';
import dynamic from 'next/dynamic';//异步加载组件
import Link from 'next/link';

import getConfig from "next/config";

import styled from 'styled-components';
// import moment from 'moment';
// import Comp from "../components/Comp";

const Comp = dynamic(import ('../components/Comp'));//执行渲染时，才加载

const {serverRuntimeConfig,publicRuntimeConfig} = getConfig();

const Title = styled.h1`
  color: yellow;
  font-size: 40px;
`

const color = '#113366'

const RouterA = ({router,name,time})=>{
console.log(serverRuntimeConfig, publicRuntimeConfig)
return (
<>
<Title>This is Title {time}</Title>
<Comp />
<Link href="#aaa">
<a className="link">
A {router.query.id} {name} {process.env.customKey}
</a>
</Link>
<style jsx>{`
        a {
          color: blue;
        }
        .link {
          color: ${color};
        }
      `}</style>
</>
)
};

RouterA.getInitialProps = async (ctx)=>{
const moment = await import('moment');
const promise = new Promise((resolve)=>{
setTimeout(()=>{
resolve({
name:'Jim',
time: moment.default(Date.now()-60*1000).fromNow()
})
},1000)
})
return await promise;
}

export default withRouter(RouterA);

0

0

Jokcy

2019-07-25

所以你改了啥？你改的代码要放出来啊。。。不然怎么帮你分析问题

0

0