1. 目标
构建一个简单的日期格式化库
# node 环境使用
const dateFlywen = require("date-flywen");
dateFlywen.format("yyyy-MM-dd hh:mm:ss"); // 2021-02-09 19:02:01
dateFlywen.parse("yyyy/MM/dd hh:mm:ss", "2021/02/09 19:02:01");
# es6 环境使用
import { format, parse } from "date-flywen";
format("yyyy-MM-dd hh:mm:ss"); // 2021-02-09 19:02:01
parse("yyyy/MM/dd hh:mm:ss", "2021/02/09 19:02:01");
# 浏览器环境使用
<script src="./fly-format.js"></script>
<script>
window.dateFlywen.format("yyyy-MM-dd hh:mm:ss"); // 2021-02-09 19:02:01
window.dateFlywen.parse("yyyy/MM/dd hh:mm:ss", "2021/02/09 19:02:01");
</script>
2. 环境搭建
## 1. 初始化工程
npm init -y
## 2. 安装 webpack 依赖
npm install webpack -D
## 3. 创建 src/index.js
## 4. 创建 webpack.config.js
const path = require("path");
module.exports = {
entry: "./src/index.js",
output: {
path: path.resolve(__dirname, "dist"),
filename: "date-flywen.js",
library: "dateFlywen",
libraryTarget: "umd",
globalObject: "this",
module: false
},
mode: "production"
}
## 5. 修改 package.json
{
"main": "dist/date-flywen.js",
"module": "src/index.js",
}
3. 功能实现
## 1. 编辑 src/index.js
import { format } from "core/format";
import { parse } from "core/parse";
function formatFromNumber(number) {
let date = new Date(number);
return formatFromObj(date);
}
function formatFromObj(obj) {
let date = [obj.getFullYear(), obj.getMonth() + 1, obj.getDate()].join("-"),
time = [obj.getHours(), obj.getMinutes(), obj.getSeconds()].join(":"),
datetime = [date, time].join(" ");
return datetime;
}
function formatDate(obj) {
if (Object.prototype.toString.call(obj) === "[object Date]") {
return formatFromObj(obj);
}
if (Object.prototype.toString.call(obj) === "[object Number]") {
return formatFromNumber(obj);
}
}
export { formatDate, format, parse };
4. 发布测试
1. 登录 npm(注意一定是 npm,不是 cnpm 或 tabao)
npm login
2. 测试没写,先放着
...
3. 打包
npm run build
4. 发布
npm publish (每次 publish,一定要修改 package.json 文件的 version 字段)