tallsafe-component v1.0.2

tallsafe-component

安装地址

npm i tallsafe-component

引入组件

你可以引入整个 tallsafe-component，或是根据需要仅引入部分组件。我们先介绍如何引入完整的 tallsafe-component

完整引入

在 main.js 中写入以下内容：

import 'tallsafe-component/lib/index.css'
import tsui from 'tallsafe-component'
Vue.use(tsui)

按需引入

借助 babel-plugin-import，我们可以只引入需要的组件，以达到减小项目体积的目的。

首先，安装 babel-plugin-import：

npm install babel-plugin-import -D

然后，将 babel.config.js 修改为：

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ],
  plugins: [["import", {
    "libraryName": "tallsafe-component",
    libraryDirectory: 'lib',
    "style": (name) => {
      return `${name}/index.css`;
    }
  }]]
}

接下来，如果你只希望引入部分组件，比如 tsmessage，那么需要在 main.js 中写入以下内容：

import { tsmessage } from 'tallsafe-component'
Vue.use(tsmessage)

编写组件

如有新的组件可以写在packages里。新建一个文件夹example。文件格式为：

example

index.js src

index.scss
main.vue

编译组件

编译命令为：

rollup -c rollup.config.js