gxw-vue2 v0.0.2

高新网前端vue2组件库

项目新建

pnpm create vite@2.8.0
注意:
1.项目名称自己填；
2.framework选vanilla；
3.variant选默认variant，默认是js开发的，选variant的话是ts开发

项目目录创建

可参考该目录

项目依赖引入

安装vite-plugin-vue2 ：pnpm install vite-plugin-vue2@1.9.3 -D
安装vue、vue-template-compiler：pnpm install vue@2.7.8 vue-template-compiler@2.7.8 -S
安装vue-router：pnpm install vue-router@3 --save
安装element-ui:pnpm install element-ui@2.8.0 --save ,这里有一个坑（最新版本的element-ui引入后使用时页面会空白显示不出来，改装2.8.0解决）
安装less:pnpm install less --save-dev

项目运行

在项目根目录
pnpm install
（若未安装pnpm，则需要运行如下命令安装：npm install -g pnpm ）
安装好node模块后,在与package.json同级目录下
pnpm run dev

目录介绍

components - 组件
demo - 本地调试、加文档引用
utils - 公共方法
components - 组件
router - 路由
index.html - 本地调试入口
index.js - 组件库打包入口
package.json - 本地安装依赖等
vite.config.js打包配置

注意： 1.components下为纯净组件，主要是上传至npm库； 2.demo下面主要是测试components中的主键，以及供文档去使用； 3.index.html一定要放在根目录下；

打包

npm run build

查看打包后的效果

npm run review

上传npm

1.npm注册：https://www.npmjs.com/package/gxw-vue2；
2.本地控制台npm登录，输入账号密码邮箱以及验证码
3.上传组件库：npm publish

组件库使用

1.安装:npm i gxw-vue2 --save
2.全局引入：在main.js里面 import gxwVue2 from 'gxw-vue2'；Vue.use(gxwVue2)；
3.局部引入：页面中，import { GxTree } from 'gxw-vue2'；components: { GxTree }；<gx-tree></gx-tree>

Customize configuration

See Configuration Reference.