Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
CoCo_Code_Op2
next.js
提交
ead5a8bc
N
next.js
项目概览
CoCo_Code_Op2
/
next.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
N
next.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
ead5a8bc
编写于
8月 30, 2018
作者:
T
Tim Neutkens
提交者:
GitHub
8月 30, 2018
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Split out Loadable.Capture and make NoSSR smaller (#5060)
上级
3ede8182
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
61 addition
and
66 deletion
+61
-66
lib/dynamic.js
lib/dynamic.js
+8
-22
lib/loadable-capture.js
lib/loadable-capture.js
+48
-0
lib/loadable.js
lib/loadable.js
+2
-42
server/render.js
server/render.js
+3
-2
未找到文件。
lib/dynamic.js
浏览文件 @
ead5a8bc
...
@@ -35,35 +35,21 @@ type LoadableOptions = {
...
@@ -35,35 +35,21 @@ type LoadableOptions = {
const
isServerSide
=
typeof
window
===
'
undefined
'
const
isServerSide
=
typeof
window
===
'
undefined
'
export
function
noSSR
(
LoadableInitializer
:
(
loadableOptions
:
LoadableOptions
)
=>
ElementType
,
loadableOptions
:
LoadableOptions
)
{
export
function
noSSR
(
LoadableInitializer
:
(
loadableOptions
:
LoadableOptions
)
=>
ElementType
,
loadableOptions
:
LoadableOptions
)
{
let
LoadableComponent
// Removing webpack and modules means react-loadable won't try preloading
// Removing webpack and modules means react-loadable won't try preloading
delete
loadableOptions
.
webpack
delete
loadableOptions
.
webpack
delete
loadableOptions
.
modules
delete
loadableOptions
.
modules
// This check is neccesary to prevent react-loadable from initializing on the server
// This check is neccesary to prevent react-loadable from initializing on the server
if
(
!
isServerSide
)
{
if
(
!
isServerSide
)
{
LoadableComponent
=
LoadableInitializer
(
loadableOptions
)
return
LoadableInitializer
(
loadableOptions
)
}
}
return
class
NoSSR
extends
React
.
Component
<
any
,
{
mounted
:
boolean
}
>
{
// This will only be rendered on the server side
state
=
{
mounted
:
false
}
return
()
=>
<
loadableOptions
.
loading
error
=
{
null
}
isLoading
pastDelay
=
{
false
}
timedOut
=
{
false
}
/
>
}
componentDidMount
()
{
this
.
setState
({
mounted
:
true
})
}
render
()
{
const
{
mounted
}
=
this
.
state
if
(
mounted
&&
LoadableComponent
)
{
return
<
LoadableComponent
{...
this
.
props
}
/
>
}
// Run loading component on the server and when mounting, when mounted we load the LoadableComponent
function
DefaultLoading
()
{
return
<
loadableOptions
.
loading
error
=
{
null
}
isLoading
pastDelay
=
{
false
}
timedOut
=
{
false
}
/
>
return
<
p
>
loading
...
<
/p
>
}
}
}
}
export
default
function
dynamic
(
dynamicOptions
:
any
,
options
:
NextDynamicOptions
)
{
export
default
function
dynamic
(
dynamicOptions
:
any
,
options
:
NextDynamicOptions
)
{
...
@@ -73,14 +59,14 @@ export default function dynamic (dynamicOptions: any, options: NextDynamicOption
...
@@ -73,14 +59,14 @@ export default function dynamic (dynamicOptions: any, options: NextDynamicOption
loading
:
({
error
,
isLoading
})
=>
{
loading
:
({
error
,
isLoading
})
=>
{
if
(
process
.
env
.
NODE_ENV
===
'
development
'
)
{
if
(
process
.
env
.
NODE_ENV
===
'
development
'
)
{
if
(
isLoading
)
{
if
(
isLoading
)
{
return
<
p
>
loading
...
<
/p
>
return
<
DefaultLoading
/
>
}
}
if
(
error
)
{
if
(
error
)
{
return
<
p
>
{
error
.
message
}
<
br
/>
{
error
.
stack
}
<
/p
>
return
<
p
>
{
error
.
message
}
<
br
/>
{
error
.
stack
}
<
/p
>
}
}
}
}
return
<
p
>
loading
...
<
/p
>
return
<
DefaultLoading
/
>
}
}
}
}
...
...
lib/loadable-capture.js
0 → 100644
浏览文件 @
ead5a8bc
/**
@copyright (c) 2017-present James Kyle <me@thejameskyle.com>
MIT License
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
*/
// https://github.com/jamiebuilds/react-loadable/blob/v5.5.0/src/index.js
// Just the `Capture` class which is only used with SSR
import
React
from
'
react
'
import
PropTypes
from
'
prop-types
'
export
default
class
Capture
extends
React
.
Component
{
static
propTypes
=
{
report
:
PropTypes
.
func
.
isRequired
};
static
childContextTypes
=
{
loadable
:
PropTypes
.
shape
({
report
:
PropTypes
.
func
.
isRequired
}).
isRequired
};
getChildContext
()
{
return
{
loadable
:
{
report
:
this
.
props
.
report
}
}
}
render
()
{
return
React
.
Children
.
only
(
this
.
props
.
children
)
}
}
lib/loadable.js
浏览文件 @
ead5a8bc
...
@@ -16,7 +16,7 @@ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
...
@@ -16,7 +16,7 @@ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWAR
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWAR
E
*/
*/
// https://github.com/jamiebuilds/react-loadable/blob/v5.5.0/src/index.js
// https://github.com/jamiebuilds/react-loadable/blob/v5.5.0/src/index.js
// Modified to be compatible with webpack 4 / Next.js
// Modified to be compatible with webpack 4 / Next.js
...
@@ -27,14 +27,6 @@ import PropTypes from 'prop-types'
...
@@ -27,14 +27,6 @@ import PropTypes from 'prop-types'
const
ALL_INITIALIZERS
=
[]
const
ALL_INITIALIZERS
=
[]
const
READY_INITIALIZERS
=
[]
const
READY_INITIALIZERS
=
[]
function
isWebpackReady
(
getModuleIds
)
{
return
getModuleIds
().
every
(
moduleId
=>
{
return
(
typeof
moduleId
!==
'
undefined
'
)
})
}
function
load
(
loader
)
{
function
load
(
loader
)
{
let
promise
=
loader
()
let
promise
=
loader
()
...
@@ -115,10 +107,6 @@ function render (loaded, props) {
...
@@ -115,10 +107,6 @@ function render (loaded, props) {
}
}
function
createLoadableComponent
(
loadFn
,
options
)
{
function
createLoadableComponent
(
loadFn
,
options
)
{
if
(
!
options
.
loading
)
{
throw
new
Error
(
'
react-loadable requires a `loading` component
'
)
}
let
opts
=
Object
.
assign
(
let
opts
=
Object
.
assign
(
{
{
loader
:
null
,
loader
:
null
,
...
@@ -145,9 +133,7 @@ function createLoadableComponent (loadFn, options) {
...
@@ -145,9 +133,7 @@ function createLoadableComponent (loadFn, options) {
if
(
typeof
opts
.
webpack
===
'
function
'
)
{
if
(
typeof
opts
.
webpack
===
'
function
'
)
{
READY_INITIALIZERS
.
push
(()
=>
{
READY_INITIALIZERS
.
push
(()
=>
{
if
(
isWebpackReady
(
opts
.
webpack
))
{
return
init
()
return
init
()
}
})
})
}
}
...
@@ -279,32 +265,6 @@ function LoadableMap (opts) {
...
@@ -279,32 +265,6 @@ function LoadableMap (opts) {
Loadable
.
Map
=
LoadableMap
Loadable
.
Map
=
LoadableMap
class
Capture
extends
React
.
Component
{
static
propTypes
=
{
report
:
PropTypes
.
func
.
isRequired
};
static
childContextTypes
=
{
loadable
:
PropTypes
.
shape
({
report
:
PropTypes
.
func
.
isRequired
}).
isRequired
};
getChildContext
()
{
return
{
loadable
:
{
report
:
this
.
props
.
report
}
}
}
render
()
{
return
React
.
Children
.
only
(
this
.
props
.
children
)
}
}
Loadable
.
Capture
=
Capture
function
flushInitializers
(
initializers
)
{
function
flushInitializers
(
initializers
)
{
let
promises
=
[]
let
promises
=
[]
...
...
server/render.js
浏览文件 @
ead5a8bc
...
@@ -10,6 +10,7 @@ import { loadGetInitialProps, isResSent } from '../lib/utils'
...
@@ -10,6 +10,7 @@ import { loadGetInitialProps, isResSent } from '../lib/utils'
import
Head
,
{
defaultHead
}
from
'
../lib/head
'
import
Head
,
{
defaultHead
}
from
'
../lib/head
'
import
ErrorDebug
from
'
../lib/error-debug
'
import
ErrorDebug
from
'
../lib/error-debug
'
import
Loadable
from
'
../lib/loadable
'
import
Loadable
from
'
../lib/loadable
'
import
LoadableCapture
from
'
../lib/loadable-capture
'
import
{
BUILD_MANIFEST
,
REACT_LOADABLE_MANIFEST
,
SERVER_DIRECTORY
,
CLIENT_STATIC_FILES_PATH
}
from
'
../lib/constants
'
import
{
BUILD_MANIFEST
,
REACT_LOADABLE_MANIFEST
,
SERVER_DIRECTORY
,
CLIENT_STATIC_FILES_PATH
}
from
'
../lib/constants
'
// Based on https://github.com/jamiebuilds/react-loadable/pull/132
// Based on https://github.com/jamiebuilds/react-loadable/pull/132
...
@@ -125,13 +126,13 @@ async function doRender (req, res, pathname, query, {
...
@@ -125,13 +126,13 @@ async function doRender (req, res, pathname, query, {
}
}
}
}
const
app
=
<
Loadable
.
Capture
report
=
{
moduleName
=>
reactLoadableModules
.
push
(
moduleName
)}
>
const
app
=
<
LoadableCapture
report
=
{
moduleName
=>
reactLoadableModules
.
push
(
moduleName
)}
>
<
EnhancedApp
{...{
<
EnhancedApp
{...{
Component
:
EnhancedComponent
,
Component
:
EnhancedComponent
,
router
,
router
,
...
props
...
props
}}
/
>
}}
/
>
<
/Loadable
.
Capture
>
<
/LoadableCapture
>
const
render
=
staticMarkup
?
renderToStaticMarkup
:
renderToString
const
render
=
staticMarkup
?
renderToStaticMarkup
:
renderToString
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录