快应用UI组件踩坑

安装快应用UI组件出现问题

https://github.com/JDsecretFE/quist-ui/
本人后端程序猿 快应用开发需要用到quist-ui的效果 费了九牛二虎才跑通
按文档操作 clone下来 运行老是报错
之前没接触node以及npm 磕磕碰碰一天 好不容易解决
记录下遇到的问题

在执行 npm install 出现一系列的警告 不用管

执行npm run watch 开始碰到各种各样的问题
[ERRO] Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: .plugins[0][1] must be an object, false, or undefined
at assertPluginItem

解决方案
根目录下.babelrc文件
{
“presets”: [
[“es2015”, { “modules”: false }]
],
“plugins”: [[“component”, [
{
“libraryName”: “mint-ui”,
“style”: true
}
]]]
}
修改成 去掉一层数组
{
“presets”: [
[“es2015”, { “modules”: false }]
],
“plugins”: [[“component”,
{
“libraryName”: “mint-ui”,
“style”: true
}
]]
}

再次运行npm run watch
[ERRO] Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module ‘babel-plugin-component’

解决方案 安装babel-plugin-component
npm i babel-plugin-component

安装成功之后 继续运行 npm run watch

那就继续安装

继续运行 npm run watch

这个按网上说是babel版本不一致导致 那就更改
es2015是6.*版本

升级es2015到7
npm i babel-preset-es2015@7.0.0-beta.3

继续运行 npm run watch
出现
[ERRO] Module build failed (from ./node_modules/hap-toolkit/packager/lib/webpack/loader/script-loader.js):
Error: Line 11: Unexpected token
这类型错误
终于到最后一个错误了 真不容易啊 一个接一个

解决方案
{
“presets”: [
[“es2015”, { “modules”: false }]
],
“plugins”: [[“component”,
{
“libraryName”: “mint-ui”,
“style”: true
}
]]
}

修改成
{
“presets”:
[“es2015”]
,
“plugins”: [[“component”,
{
“libraryName”: “mint-ui”,
“style”: true
}
]]
}
将presets二维数组变一维

希望能帮到像我一样的菜鸟 而又不得不用