这里写的情况是通过vue-cli创建的项目
一: uniapp官网创建项目
- 打开命令行,全局安装vue-cli
npm install -g @vue/cli@4.5.15 - 创建项目
vue create -p dcloudio/uni-preset-vue my-project -
选择默认版
image.png
二: 引入uview组件
命令行进入项目:
cd "你的项目名称"
uview官网教程
注意,如果跟着官网命令走,运行起来会报错,"TypeError: this.getOptions is not a function", 是因为sass-loader 版本太高，需要降级;
当你搜索解决了这个错误后又会报" Node Sass Version 6.0.6 is incompatible with ^4.0.0 || 5.0.0",是因为node-sass为6.0.1，而node-sass的期待值是4.0.0 - 5.0.0,当你搜索到解决方法后,会发现卸载不了node-sass,没有权限;所以我们可以直接下载适合的版本;
主要注意的就是这两句命令,其他的根据官网教程走就好了,这可能是初学者的一个天坑吧,至少对于我是哈哈,每创建一次新项目就会困扰我,还是记录一下;
新增: 新创建项目运行显示 :" Error: Cannot find module 'webpack/lib/RuleSet'"
原因: 1.查看vue-cli的版本,有可能创建cli时直接运行的npm install -g @vue/cli,这样版本太高会报这个错
看看是不是版本太高了 ，vue --version 推荐使用4.0版本的
我在vue-cli 5.0.1版本也出现这个问题 ，改成4.0的就好了
//查看版本:
vue - V
// 如何删除vue-cli
//如果是 npm install -g vue-cli安装的，就 npm uninstall -g vue-cli 删。
//如果是 npm install -g @vue/cli 安装的，就 npm uninstall -g @vue/cli 删。
//下载4.0版本
npm i -g @vue/cli@4.5.15
//下载好后重新再创建一次项目就ok了
按照官网后运行,如果报错:"看到此报错，是因为没有配置vue.config.js的【transpileDependencies】",这个只需要在项目根目录下创建js文件,vue.config.js 重新运行项目即可;
出现这个问题的原因是用vue-cli3创建项目时,并不会自动创建vue.config.js，因为vue-cli3内部高度集成了webpack，一般来说使用者不需要再去修改,是个可选项，所以一般都是需要修改webpack的时候才会自己创建一个vue.config.js
//vue.config.js
module.exports = {
transpileDependencies: ['uview-ui']
}
