Skip to content

neurotoxinvx/ls-offline

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

LSOffline Plugin

WebPack 静态资源离线化插件

为什么选择 LSOffline Plugin

友好,无需更换构建工具全家桶

简单,仅需搭配 html-webpack-plugin 即可运行

省心,每次上线自动更新本地离线资源

依赖

1.ls-offline 依赖 html-webpack-plugin ,请务必安装 html-webpack-plugin

2.请在调用 ls-offline 之前调用 html-webpack-plugin,并且将 html-webpack-plugin 的 inject 选项置为 false

3.首次加载静态资源时使用 XMLHttpRequest 请求资源,所以在使用 ls-offline 前请为你的静态资源开启跨域(CORS),如果未开启跨域将会报错且无法正常运行 ls-offline

安装

$ npm install ls-offline --save-dev

快速开始

webpack.config.js

var HtmlWebpackPlugin = require('html-webpack-plugin')
var LSOffline = require('ls-offline')

module.exports = {
  ...
  plugins: [
    new HtmlWebpackPlugin({
      inject: false
    }),
    new LSOffline()
  ]
}

DEMO

# clone ls-offline 项目到本地
$ git clone https://github.com/neurotoxinvx/ls-offline.git

# 进入 ls-offline 项目
$ cd ls-offline

# 安装项目依赖
$ npm install

# 运行 DEMO
$ npm run demo

# 编译打包输出文件
$ npm run build

参数

参数传入
new LSOffline({
  cache: true,
  debug: false
})
参数列表:
1.debug

类型: Boolean

默认: false

是否开启 debug 模式,开启 debug 模式后 client 端代码不会进行压缩混淆。默认为 false

2.cache

类型: Boolean

默认: true

是否启用 localStorage 离线化。默认为 true

Inspired by

静态资源(JS/CSS)存储在localStorage有什么缺点?为什么没有被广泛应用?- 张云龙的回答

LSLoader - localStorage loader to increase mobile webapp speed

LICENSE

MIT

About

A webpack plugin for cache static resource

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published