前言
随着前端技术的发展，开发效率成为了非常重要的一个问题。如何利用好已有的工具与资源，提高前端工作效率是每个前端工程师和团队追求的目标之一。在此背景下，npm包在前端开发中逐渐崭露头角。
而本篇文章所介绍的npm包--wiki-plugin-tally，是一款能够在wiki中实现账单记账功能的插件。
wiki-plugin-tally简介
wiki-plugin-tally是一个由nodejs编写的npm包，可以用于在wiki页面中添加账单记账功能。它基于Vue.js 2.x和element-ui两个非常流行的前端框架，使用简单，易于扩展。
通过wiki-plugin-tally，我们可以快速实现公司内部的记账功能，方便大家记录和分析支出，为企业的财务管理提供帮助。
安装
首先，你需要在你的计算机上安装Node.js和npm。
然后，在命令行中执行以下命令进行安装：
npm install wiki-plugin-tally
使用
引入
在页面中引入element-ui和tally插件的css和js文件。
<!-- 引入element-ui --> <link rel="stylesheet" href="//unpkg.com/element-ui/lib/theme-chalk/index.css"> <!-- 引入tally插件 --> <link rel="stylesheet" href="//unpkg.com/wiki-plugin-tally/dist/wiki-plugin-tally.min.css"> <script src="//unpkg.com/vue/dist/vue.js"></script> <script src="//unpkg.com/element-ui/lib/index.js"></script> <script src="//unpkg.com/wiki-plugin-tally/dist/wiki-plugin-tally.min.js"></script>
注册组件
然后，在你的Vue实例中注册Tally组件。
import Tally from 'wiki-plugin-tally'; Vue.component(Tally.name, Tally);
使用组件
最后，在页面中使用Tally组件。
-- -------------------- ---- -------
----------
-----
------ --
------
-----------
--------
------ ------- -
----- ------
--
---------示例
我们来看一个简单的示例，实现一个简单的账单添加功能。
-- -------------------- ---- -------
----------
-----
-------------
-------- --------------------- ------------------- ------------- -----------
------------- -----------
--------------- ------------------- ----------- ------------------------------------
---------------
------------- -----------
--------------- --------------------
---------------- -----------------------------
---------------- -----------------------------
-----------------
---------------
------------- -----------
---------------- --------------------- -------------- -------- -------------------------------
---------------
------------- -----------
--------- ---------------------------------
---------------
----------
---- ---------------------
---------- -------------- --------------------------------
---------- -------------------------------
------
------
-----------
--------
------ ------- -
------ -
------ -
----- -
----- ---
----- -----
------- --
------- --
--
--
--
-------- -
---------- -
------------------------------ -- -
-- ------- -
---------------
-------- -------
----- ---------
---
- ---- -
---------------
-------- ----------------
----- -------
---
------ ------
-
---
--
--------- -
------------------------------
-
-
--
---------总结
在本文中，我们学习了如何使用wiki-plugin-tally这个npm包，在wiki中实现记账功能。通过本文的学习，希望大家能对如何利用npm包提升前端开发效率有一定了解，也希望Tally插件能给有需要的人带来帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600556bc81e8991b448d3868