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

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