npm 包 awwwards-of-the-day 使用教程-JavaScript中文网-JavaScript教程资源分享门户

介绍

awwwards-of-the-day 是一个前端开发者经常用到的 npm 包，它可以让你在你的网站上展示 awwwards 当日的最佳网站设计。awwwards 是一个国际性的网站设计奖项网站，他们每天都会选出一些网站并给出评价。awwwards-of-the-day 的作用是在你的网站上展示这些每日最佳网站设计。

awwwards-of-the-day 的特点：

简单易用，集成方便
可自定义样式
可选择语言

让我们来看看如何使用这个 npm 包。

安装

使用 npm 安装 awwwards-of-the-day：

npm install awwwards-of-the-day --save

引入

在你的项目中导入 awwwards-of-the-day：

import AwwwardsOfTheDay from 'awwwards-of-the-day';

使用

awwwards-of-the-day 非常简单易用。你只需要在你的页面上使用 <AwwwardsOfTheDay /> 标签就可以了。

-- -------------------- ---- -------
------ ---------------- ---- ----------------------

-------- ----- -
  ------ -
    -----
      ------ ------- ------------
      ----------------- --
    ------
  --
-

------ ------- ----

以上代码将在页面上展示一个当前最佳网站设计的图标和网站信息。

你也可以自定义 awwwards-of-the-day 的样式，只需在 CSS 中添加以下样式：

.awwwards-of-the-day {
  border: 1px solid #ccc;
  padding: 10px;
  background-color: #f5f5f5;
}

你还可以选择你需要的展示语言。目前支持的语言有英语和法语。只需要在 <AwwwardsOfTheDay /> 标签中传入 locale 属性即可。

<AwwwardsOfTheDay locale="fr" />

以上代码将使用法语展示 awwwards-of-the-day。

示例代码

-- -------------------- ---- -------
------ ---------------- ---- ----------------------

-------- ----- -
  ------ -
    -----
      ------ ------- ------------
      ----------------- ----------- -------------------- --
    ------
  --
-

------ ------- ----

-- ---
--------- -
  ------- --- ----- -----
  -------- -----
  ----------------- --------
-

结论

awwwards-of-the-day 是一个非常实用的 npm 包，可以让你在你的网站上展示当前最佳网站设计。它非常易用，同时也可以自定义样式和选择语言。无论是个人网站还是商业网站都可以使用 awwwards-of-the-day 来提升用户体验。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6005542f81e8991b448d183e