山村旅游网
a 当前位置: 山村旅游网 » 趣闻 » 正文

webpack,Scope,Hoisting

 小狐 • 2020-02-16 20:03  来源:互联网  E659

1、Scope Hoisting(作用域提升)

在 webpack 的配置中,我们可以看到如下:

plugins:

new webpack.optimize.ModuleConcatenationPlugin

这里是 webpack3 引入的 Scope Hoisting(作用域提升)借鉴了 rollup 打包工具

webpack 打包一般会将 bundle 中各个模块单独打包成闭包。相比 rollup 可以提升或者预编译所有模块到一个闭包中,从而提升执行速度

当然它只适用于 ES 模块

这里还提到了一个 cli 的参数配置:

--display-optimization-bailout

2、fast-sass-loader

对比 sass-loader 速度快

webpack,Scope,Hoisting(图1)

当然处理 sass 都会用到 node-sass,自带的 Cache:

classCache

constructor(entry)

this.entry = entry

isValid

read

getDependencies

markInvalid

write

module.exports = Cache

3、react-html-parser

A utility for converting HTML strings into React components.

Avoids the useofdangerouslySetInnerHTML

andconverts standard HTML elements。

attributesandinline styles intotheir React equivalents.

importReact from“react”

importReactHtmlParser。

processNodes。

convertNodeToElement。

from“react-html-parser”

classHtmlComponentextendsReact. Component

render

consthtml =

Example HTML string

return< div>{ ReactHtmlParser(html) } div>。

本文相关词条概念解析:

模块

模块是对词条中部分内容进行格式化整理的模板。定义1:整个系统的设备和设施按工艺布置要求组装在钢构架内,整体运输和吊装的集装块。所属学科:船舶工程(一级学科);海洋油气开发工程设施与设备(二级学科)定义2:在海洋工程中专指整个系统的设备和设施按工艺要求组装在钢构架内,可整体运输和吊装的集装块。所属学科:海洋科技(一级学科);海洋技术(二级学科);海洋工程(三级学科)。

网友评论Translation