本人是一个应届生，因为最近毕设闲置了下来，就想着能不能搭建自己的一个UI框架呢，没事玩玩，还可以学一些知识。主要是要讲一下里面的流程。个人以为当前需要把大体的流程熟悉，ui框架嘛，有很多可以开箱即用的，可以基于他们来重新搞。
- 用vue初始化基于webpack的myUI项目。打开文件夹、然后打开一个终端，可以直接用git bash哈。
vue init webpack my-ui
- 然后进行这个初始化之后的文件夹运行一下
先 npm i
后 打开package.json 查看一下本地运行指令 npm run dev
- 这个开始编写组件代码，或者可以去github拉去比较好的开源框架（小众的）,主要就是了解一些流程嘛，可以像这样。packages可以放入源代码 src可以放当前项目运行时候界面。
- 因为我们要发包到npm嘛，然后就会想到，import时候应该要引入我们这个包的入口，这样我们就应该在package.json main字段里面修改一下。当然import会有很多的规则。
import MyUI from 'my-ui'
Vue.use(MyUI)
"main": "./packages/index.js",
- 我们使用Vue.use(),遇到导出install函数，具体可以百度一下下
import FTable from './components/table/index'
const components = [
FTable,
]
const install = function (Vue) {
components.forEach(component => {
Vue.component(component.name, component)
})
}
if (typeof window !== 'undefined' && window.Vue) {
install(window.Vue);
}
export default {
install,
FTable,
}
- 然后我们开始发包，这个就需要使用npm镜像。使用一下指令切换,publish出错的话移步这篇文章
npm config set registry https://registry.npmjs.org/
npm publish
- 因为我之前发过npm,所以不要进行账号密码验证了，注意把 package.json 里面private改成false,发布成功会有邮箱提示的。
-
登录npm可以进行查看
-
然后我们查看自己的一些其他包,这是我上天发布的包。
10.然后我们使用一下自己的包试试看看能用不
npm i my-ui-sww
页面中使用发现能用耶
