uniapp的h5项目 用命令起这个项目(vue-cli)

这里其实就相当于给uniapp h5套了一个vue-cli的壳(纯属个人感觉)

首先需要安装vue-cli 脚手架

npm install -g @vue/cli

然后创建项目(这里需要在hbuilder创建)

vue create -p dcloudio/uni-preset-vue uniapp

在这里插入图片描述
安装成功后它的结构是目录,
在这里插入图片描述
打开项目查看package.json文件,所有对应的命令都已经有了
在这里插入图片描述
用命令运行一下

cd uniapp
npm run dev

然后在把你的uniapp h5项目全部拷贝到 src文件下(这里除了node_modules不用拷贝)
拷贝完后 安装你的项目中用到ui库
比如npm install uview-ui@2.0.36

目前我自己的node 版本是16.19.0
然后运行会报 node-sass 未安装,安装版本太大会报错 (或运行不了)
最后解决办法是

npm i -D sass

然后在运行又报错

ES Modules may not assign module.exports or exports.*, Use ESM export syntax

这个网上查说是因为项目中用到了module.exports及require是属于commonJS,而export default及import则属于ES6

网上找到的方法说在package.json 文件加"type": "commonjs" 我用没有生效

最后解决方法 改为 export default

export default

然后在运行 就出现了跨域问题
解决方法

新建一个vue.config.js文件

// vue.config.js,如没有此文件则手动创建
module.exports = {
	transpileDependencies: ['uview-ui'],
	publicPath: './',

	devServer: {

		proxy: {
			"/dev-api": {
				target: "http://192.168.3.31:8080", //目标接口域名
				changeOrigin: true, //是否跨域
				secure: true, // 设置支持https协议的代理
				pathRewrite: {
					///是否重写,重写路径,就是将上面的/替换为''
					"^/dev-api": ""
				}
			}
		}
	}
}

这里需要注意一下,如果uniapp 项目中的manifest.json里有代理需要删除(我用的时候也报错运行不起来)

在运行,我目前是成功了(以上是我用命令遇到的坑)

相关推荐

  1. uniapp-H5项目

    2024-04-12 11:06:01       55 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-04-12 11:06:01       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-04-12 11:06:01       106 阅读
  3. 在Django里面运行非项目文件

    2024-04-12 11:06:01       87 阅读
  4. Python语言-面向对象

    2024-04-12 11:06:01       96 阅读

热门阅读

  1. intellij idea的快速配置详细使用

    2024-04-12 11:06:01       43 阅读
  2. 两种lca模版

    2024-04-12 11:06:01       40 阅读
  3. CF1951E No Palindromes 题解

    2024-04-12 11:06:01       41 阅读
  4. 洛谷 P1434滑雪

    2024-04-12 11:06:01       48 阅读
  5. 【php快速上手(五)】

    2024-04-12 11:06:01       54 阅读
  6. QT:QT实现TCP协议

    2024-04-12 11:06:01       52 阅读
  7. 设计模式:命令模式

    2024-04-12 11:06:01       189 阅读
  8. uni-app中,页面跳转前,进行拦截处理的方法

    2024-04-12 11:06:01       46 阅读
  9. 容器化部署--知识点标记

    2024-04-12 11:06:01       54 阅读
  10. 每天学习一个Linux命令之pwd

    2024-04-12 11:06:01       39 阅读