简介
bedrock-mccririck 是一个轻量级的 npm 包，它提供了一些实用的前端工具函数和样式库。使用 bedrock-mccririck，可以方便快捷地开发前端项目，减少代码重复性和提高开发效率。
安装
在命令行中使用 npm 安装 bedrock-mccririck：
npm install bedrock-mccririck
使用
在项目中引入 bedrock-mccririck：
import bedrockMccririck from 'bedrock-mccririck';
然后，就可以使用 bedrock-mccririck 中提供的函数和样式了。
函数
createObjectURL
创建一个 object URL，用于将 Blob 或 File 对象转换为 URL。
const blob = new Blob(['hello, world'], { type: 'text/plain' });
const url = bedrockMccririck.createObjectURL(blob);formatFileSize
格式化文件大小，返回带单位的字符串。
const size = bedrockMccririck.formatFileSize(2048); // "2 KB"
parseQueryString
解析 URL 中的查询参数，返回对象。
const query = bedrockMccririck.parseQueryString('?id=123&name=john');
// { id: '123', name: 'john' }sleep
延迟指定的时间（毫秒）。
await bedrockMccririck.sleep(1000); // 等待 1 秒
storage
使用浏览器本地存储（localStorage 或 sessionStorage）存储或获取数据。
bedrockMccririck.storage.set('username', 'john');
const username = bedrockMccririck.storage.get('username');stopPropagation
阻止冒泡。
function handleClick(e) {
// ...
bedrockMccririck.stopPropagation(e);
}throttle
节流函数，限制函数调用频率。
function handleScroll(e) {
// ...
}
document.addEventListener('scroll', bedrockMccririck.throttle(handleScroll, 100));样式
bedrock-mccririck 中包含了一些基础样式，可以用于快速搭建页面。
Typography
bedrock-mccririck 的 Typography 样式包含了一些常见的字体样式，如标题、段落、链接、列表等。
<h1 class="bm-heading">Heading 1</h1> <p class="bm-paragraph">This is a paragraph.</p> <a href="#" class="bm-link">Link</a> <ul class="bm-list"> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul>
Grid
bedrock-mccririck 的 Grid 样式可以快速地搭建网格布局。
<div class="bm-container">
<div class="bm-row">
<div class="bm-col-sm-6">Column 1</div>
<div class="bm-col-sm-6">Column 2</div>
</div>
</div>Button
bedrock-mccririck 的 Button 样式包含了一些常见的按钮样式，如默认按钮、主要按钮、危险按钮等。
<button class="bm-btn">Default</button> <button class="bm-btn bm-btn-primary">Primary</button> <button class="bm-btn bm-btn-danger">Danger</button>
总结
bedrock-mccririck 是一个实用的 npm 包，它提供了一些常用的前端工具函数和样式库，可以帮助我们更快更好地开发前端项目。在使用 bedrock-mccririck 时，我们还需要掌握一些基础的 JavaScript 和 CSS 知识，才能更好地运用这些函数和样式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005661081e8991b448e1f1f