Lofter-mp-webpack-plugin NPM

lofter-mp-webpack-plugin

使用方式

webpack.config.js

import OfflinePackage from "lofter-mp-webpack-plugin"

const offlineEntry = getEntry();
module.exports = {
  ...
  plugins: [
    new HtmlWebpackPlugin(),
    new OfflinePackage({
    packageNameValue: 'test',
    appId: 'lofter1',
    uploadConfigUrl: 'http://www.lofter.com/mp/api/appVersion/add',
    baseUrl: `//www.lofter.com/mp/lofter1/`,
    cdnUrl: `//l.bst.126.net/mp/lofter1/`,
    nosConfig: nosConfig,
    ignoreFileTypes: ['txt', 'js.map'],
    excludeFileName: ['page22'], // 使用indexOf匹配
    entry: offlineEntry,
    extraManifest: { // {资源名：路径名}，全匹配并覆盖
      "static/jquery.min.js": "//cdn.bootcss.com/jquery/2.2.4/jquery.min.js",
      "static/bootstrap.min.css": "//cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css",
    },
    extraExamineUrls: [ // 配置额外触发包下载的url
      '//www.lofter.com/mp/lofter1',
      '//www.lofter.com/mp/lofter2'
    ],
    loadingQuietly: true, // 单包情况下配置是否静默加载
    dividePackageConfig: [{
      loadingQuietly: true, // 默认为true
      entryFile: ['index'],
      extraExamineUrls: [ // 配置额外触发包下载的url
        '//www.lofter.com/mp/lofter1',
        '//www.lofter.com/mp/lofter2'
      ],
    },{
      loadingQuietly: false,
      entryFile: ['page1'],
    }]
  })
  ]
}

调用顺序需要在HtmlWebpackPlugin之后，配置信息可以通过配置文件的形式从外部引入，可以参考lofter-mp-projects工程的项目配置。

配置项

Name	Required	Type	Default	Description
`packageNameValue`	`true`	`{String}`	`offlinePackage`	离线包名称，会用于上传文件标识
`appId`	`true`	`{String}`	\| 离线包 Id
`uploadConfigUrl`	`true`	`{String}`	\| 离线包资源上传接口
`baseUrl`	`true`	`{String}`	`//www.lofter.com/mp/{appId}/`	页面访 html 访问链接的统一前缀，不包含相对路径的部分，注意末尾的`/`
`cdnUrl`	`true`	`{String}`	`//l.bst.126.net/mp/{appId}/`	页面静态资源的统一前缀，不包含相对路径的部分，注意末尾的`/`
`nosConfig`	`true`	`{Object}`	`'../nos.json'`	nos 上传配置
`ignoreFileTypes`	`false`	`{String[]}`	\| 生成映射文件时需要忽略的文件类型，注意`map`类型的文件，需要带上其真实的文件类型，比如`css.map`, `js.map`
`excludeFileName`	`false`	`{String[]}`	\| 生成映射文件时需要忽略的文件，使用 indexOf 匹配
`loadingQuietly`	`false`	`{Boolean}`	\| 单包的静默加载配置
`entry`	`true`	`{Object}`	\| 需要进行离线处理的页面入口，同`HtmlWebpackPlugin`的用法
`extraManifest`	`false`	`{Object}`	\| 直接写入映射文件的配置，`{ 资源名：路径名 }`，全匹配并覆盖
`extraExamineUrls`	`false`	`{String[]}`	\| 配置额外触发包下载的 url，会添加在 `urls` 配置中
`dividePackageConfig`	`false`	`{Object[]}`	\| 分包配置，`entryFile`为入口文件夹的名称，`loadingQuietly`为静默加载配置，使用分包配置后，未配置的入口文件将默认作为额外的最后一个包
`debug`	`false`	`{Boolean}`	`true`	是否开启运行日志
`folderName`	`false`	`{String}`	`package`	每个分包的包名前缀，类似`package_1`
`indexFileName`	`false`	`{String}`	`manifest`	每个分包的映射文件名前缀，类似`manifest_1`
`programInfoFileName`	`false`	`{String}`	`program.json`	上传小程序配置平台的配置文件，即客户端获取到的配置信息`
`transformExtensions`	`false`	`{RegExp}`	/^(gz\|map)$/i	判断文件类型额外信息的正则，主要处理`map`类型文件，生产环境不推荐开启`source-map`

folderName, indexFileName, programInfoFileName在使用于 lofter 容器时不建议修改。

TODO

可以主动控制删除已发布的静态资源
小程序上传版本，提供描述

webpack offline-package

axios chalk crypto-js jszip lodash mime-types nw-multi-upload path webpack-sources

@infinitebrahmanuniverse/nolb-lof @everything-registry/sub-chunk-2096

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago