搭建vux项目

介绍:VUX是基于WeUI和Vue(2.x)开发的移动端UI组件库,基于webpack + vue-loader + vux可以快速开发移动端页面

VUX 必须配合 vux-loader 使用

首先搭建vue项目

1.安装vue
npm install vue --save
可以安装淘宝镜像
npm install --registry=https://registry.npm.taobao.org
2.安装三脚架vue-cli
npm install vue-cli -g || cnpm install vue-cli -g
3.搭建项目
vue init webpack +项目名(my-project)
4.cd my-project 进入项目中
5.npm install || cnpm install 安装依赖包
6.npm run dev || cnpm run dev 启动项目
到这项目启动 证明vue项目搭建成功

安装vux

1.npm install vux --save || cnpm install vux --save
2. 安装vux-loader
npm install vux-loader --save-dev || cnpm install vux-loader --save-dev
3.安装less-loader
npm install less less-loader --save-dev || cnpm install less less-loader --save-dev
4.在build文件夹下webpack.base.conf.js 文件进行配置
新加内容:
const vuxLoader = require(‘vux-loader’)
const webpackConfig = originalConfig

originalConfig就是原来的 module.exports出去的代码,把它整个赋值给变量 webpackConfig
在最后加入 module.exports = vuxLoader.merge(webpackConfig, { plugins: [‘vux-ui’] }) 引用插件vux

在 resolve:{
extensions:[’.js’, ‘.vue’, ‘.json’, ‘.less’]}里加入".less"

最后启动项目 npm run dev || cnpm run dev

启动出现的问题:

1.报错【Syntax Error: TypeError: this.getOptions is not a function】

可能原因:默认安装了最新版本的less和less-loader,

解决办法:

1.卸掉最新的版本,下载稳定的版本 推荐使用less@3.9.0 less-loader@4.1.10

npm uninstall less || cnpm uninstall less
npm uninstall less-loade || cnpm uninstall less-loade

安装:

npm install less@3.9.0 || cnpm uninstall less@3.9.0
npm uninstall less-loader@4.1.10 || cnpm uninstall less-loader@4.1.10

安装后重启即可

2.vue 解决*!!vue-style-loader!css-loader?{“sourceMap”:true}或_modules/vux/src/components/alert/index.vue…问题

可能是css解析出现的问题:

如果用的是.css 文件,执行 npm install stylus-loader css-loader style-loader --save-dev 安装依赖就行。
如果用的是.less 文件,执行 npm install less less-loader --save-dev 安装依赖就行。 vux是需要使用.less文件
如果用的是.sass 文件,执行 npm install sass sass-loader --save-dev 安装依赖就行。或者($npm intall sass-loader --save ; $npm install node-sass --save)
ps:我出现这个报错是因为 我再出现【Syntax Error: TypeError: this.getOptions is not a function】只卸载了lass-loader 重装,然后有了第二个报错,然后按照解决方法后又出现 “Error evaluating function unit: the first argument to unit must be a number”的问题 很奇葩,如果有人也遇见了,请把less也卸载了 安装稳定版本;
另外:如果安装低版本之后还出现问题 可能是版本还不适合,你可以尝试再下载地的版本

vue+vux vux安装出现错误相关推荐

  1. vue.js+vux项目总结

    最近做完一个vue.js+vux的移动端项目,刚刚完成上线,记录一下开发过程中遇到的问题,避免以后再次遇到时,可以翻阅查看. 1. 无法设置服务器发送过来的cookie 这是一个保存登录状态的问题,后 ...

  2. 前端 vue + element + vux

    前端 vue + element + vux 页面效果 学习资料 https://blog.csdn.net/yangwenpei116/article/details/90206523

  3. php高版本安装ecshop错误解决方法

    php高版本安装ecshop错误解决方法 参考文章: (1)php高版本安装ecshop错误解决方法 (2)https://www.cnblogs.com/bqx619/p/5014171.html ...

  4. linux源码安装php缺少动态库,php源代码安装常见错误解决办法

    php源代码安装常见错误解决办法 错误:configure: error: libevent >= 1.4.11 could not be found 解决:yum -y install lib ...

  5. java安装jdk错误1316 指定的账户已存在

    java安装jdk错误1316 指定的账户已存在 处理步骤: 1.卸载jdk,成功后重启 2.删除注册表中文件夹 (1)\HKEY_LOCAL_MACHINE\SOFTWARE\JavaSoft文件夹 ...

  6. vue - cli 脚手架安装

    一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v  (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , ...

  7. 关于node.js 和vue.js的安装、卸载、浏览器测试问题?

    关于node.js 和vue.js的安装.卸载.浏览器测试问题? 最近忙于深入研究vue.js框架的适用问题,所以顺带也有必要系统的研究一下node.js是怎么一回事?! 闲话不多说,直接上文章链接: ...

  8. python pip安装第三方库老是报错_#python pip 安装dlib一直失败?#python安装dlib错误...

    #python pip 安装dlib一直失败?#python安装dlib错误 python dlib 教程2020-10-11 07:52:36人已围观 ubuntu里面怎么安装dlib 下面是在ub ...

  9. 在linux底下用pip安装mysqlclient错误解决办法

    1.在linux底下用pip安装mysqlclient错误,使用命令pip install mysqlclient,报如下图的错误: 2.原因是linux少了mysql相关的库,需要安装一下,使用命令 ...

最新文章

  1. Silverlight技术支持谷歌Android
  2. 新工具:表单/Cookie 验证网站爬网设置工具
  3. 没有统计学基础可以学python-机器学习和Python怎样快速掌握?你一定需要这27张清单...
  4. aspnetcore 实现简单的伪静态化
  5. Java基础-this关键字和构造方法(10)
  6. Matplotlib 整合与细节操作(样式、图例、风格、轴线、网格)
  7. 将Visual Studio更新到最新版本
  8. 2016年CIO的五个优先级
  9. remoting 中事件找不到订阅者时引发异常的解决办法
  10. JavaFX之3 动画与事件处理
  11. 再不用担心Sci-Hub不能用了
  12. 各种计算机控制系统特点小结
  13. Kms 激活服务器搭建
  14. [3D图形学]视锥剔除入门(翻译)
  15. 硬核干货,史上最强获取GitHub所有仓库内容数据分析教程
  16. gitlab推送钉钉机器人配置
  17. 《离别小叙》一个感伤的程序员
  18. 电源滤波为何通常是一大一小两个电容并联?
  19. 经典背包问题3——背包问题求方案数 、背包问题求具体方案
  20. Qt quick 示例:推特搜索小程序开发

热门文章

  1. Merkle Tree
  2. python稳健性检验_浅谈使用python处理数据的日常经验
  3. 链表的回文结构(有图易懂)
  4. 分享30个免费主机的网站
  5. 本贾尼·斯特劳斯特卢普(Bjarne Stroustrup)的主页
  6. JavaScript–Apple设备检测代码.
  7. IDAE中Modules, Facets 和 Artifacts 的作用及区别
  8. htmlCSS-----盒模型
  9. python中列表中的字符串转换成数字
  10. C++20四大之二:coroutines特性详解