如果执行 webpack，你会发现创建了一个体积相当大的文件。如果你查看这个文件，会看到 lodash 也被打包到代码中。在这种场景中，我们更倾向于把 lodash 当作 peerDependency。也就是说，consumer(使用者) 应该已经安装过 lodash 。因此，你就可以放弃控制此外部 library ，而是将控制权让给使用 library 的 consumer 。参考：https://webpack.docschina.org/guides/author-libraries/#externalize-lodash
const
path
=
require
(
'path'
)
module
.
exports
=
{
entry
:
'./index.js'
,
mode
:
'production'
,
output
:
{
path
:
path
.
resolve
(
__dirname
,
'dist'
)
,
filename
:
'[name].js'
,
library
:
{
name
:
'hoo'
,
type
:
'umd'
,
export
:
'default'
globalObject
:
'this'
module
:
{
rules
:
[
{
test
:
/
\.js$
/
,
exclude
:
/
node_modules
/
,
use
:
{
loader
:
'babel-loader'
,
options
:
{
presets
:
[
'@babel/preset-env'
]
externals
:
{
lodash
:
{
commonjs
:
'lodash'
,
commonjs2
:
'lodash'
,
amd
:
'lodash'
,
root
:
'_'
这意味着你的 library 需要一个名为 lodash 的依赖，这个依赖在 consumer 环境中必须存在且可用。
有这样子一个需求就是需要通过
webpack
引入
一个
sdk
，然后就找到了这html-
webpack
-plugin-before-html-processing这个搭配html-
webpack
-plugin使用的钩子函数
然后使用
js
dom模拟html，最终把想要的
sdk
插入到html中
const
js
dom = require('
js
dom');
//操作DOM要在这
引入
找个
包
const {
JS
DOM } =
js
dom;
var timer = Date.now();
function Warden
npm
install babel-preset-stage-3 babel-preset-es2015 --save-dev
2.配置.babelrc（工程根目录下，无则新创建）
"presets": ["env", "es2015", "...
eslint的好处就不多说了。
1.安装依赖
npm
install --save-dev eslint eslint-friendly-formatter eslint-loader
yarn add eslint eslint-friendly-formatter eslint-loader
2.根目录创建.eslintrc.
js
文件，配置eslint规则(为了便于开发，这里只列...
打包
JS
库demo项目地址：github.com/BothEyes199…
最近有个需求，需要为小程序写一个
SDK
，监控小程序的后台接口调用
和
页面报错(类似fundebug)
听起来高大上的
SDK
，其实就是一个
JS
文件，类似平时开发中我们
引入
的第三方库:
const moment = require('moment');
moment().format();
小程序的模块化采用了C...
