uniapp新建的vuecli项目启动报错并且打包失败的问题(已解决)

news2024/10/7 16:24:04

 我的项目新建流程如下

 

运行之后就是如下报错 

解决办法:

安装如下依赖: 

 npm i postcss-loader autoprefixer@8.0.0

 npm run build 编译失败

 安装如下依赖:

npm install postcss@8.2.2

最终package.json文件如下

{
  "name": "lsyj-app-vuecli",
  "version": "1.1.0",
  "private": true,
  "scripts": {
    "serve": "npm run dev:h5",
    "build": "npm run build:h5",
    "build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build",
    "build:custom": "cross-env NODE_ENV=production uniapp-cli custom",
    "build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
    "build:mp-360": "cross-env NODE_ENV=production UNI_PLATFORM=mp-360 vue-cli-service uni-build",
    "build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build",
    "build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build",
    "build:mp-jd": "cross-env NODE_ENV=production UNI_PLATFORM=mp-jd vue-cli-service uni-build",
    "build:mp-kuaishou": "cross-env NODE_ENV=production UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build",
    "build:mp-lark": "cross-env NODE_ENV=production UNI_PLATFORM=mp-lark vue-cli-service uni-build",
    "build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build",
    "build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build",
    "build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
    "build:mp-xhs": "cross-env NODE_ENV=production UNI_PLATFORM=mp-xhs vue-cli-service uni-build",
    "build:quickapp-native": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-native vue-cli-service uni-build",
    "build:quickapp-webview": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview vue-cli-service uni-build",
    "build:quickapp-webview-huawei": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build",
    "build:quickapp-webview-union": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build",
    "dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch",
    "dev:custom": "cross-env NODE_ENV=development uniapp-cli custom",
    "dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve",
    "dev:mp-360": "cross-env NODE_ENV=development UNI_PLATFORM=mp-360 vue-cli-service uni-build --watch",
    "dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch",
    "dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
    "dev:mp-jd": "cross-env NODE_ENV=development UNI_PLATFORM=mp-jd vue-cli-service uni-build --watch",
    "dev:mp-kuaishou": "cross-env NODE_ENV=development UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build --watch",
    "dev:mp-lark": "cross-env NODE_ENV=development UNI_PLATFORM=mp-lark vue-cli-service uni-build --watch",
    "dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
    "dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch",
    "dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch",
    "dev:mp-xhs": "cross-env NODE_ENV=development UNI_PLATFORM=mp-xhs vue-cli-service uni-build --watch",
    "dev:quickapp-native": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-native vue-cli-service uni-build --watch",
    "dev:quickapp-webview": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview vue-cli-service uni-build --watch",
    "dev:quickapp-webview-huawei": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build --watch",
    "dev:quickapp-webview-union": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build --watch",
    "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
    "serve:quickapp-native": "node node_modules/@dcloudio/uni-quickapp-native/bin/serve.js",
    "test:android": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=android jest -i",
    "test:h5": "cross-env UNI_PLATFORM=h5 jest -i",
    "test:ios": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=ios jest -i",
    "test:mp-baidu": "cross-env UNI_PLATFORM=mp-baidu jest -i",
    "test:mp-weixin": "cross-env UNI_PLATFORM=mp-weixin jest -i"
  },
  "dependencies": {
    "@dcloudio/uni-app": "^2.0.2-3090520231028001",
    "@dcloudio/uni-app-plus": "^2.0.2-3090520231028001",
    "@dcloudio/uni-h5": "^2.0.2-3090520231028001",
    "@dcloudio/uni-i18n": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-360": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-alipay": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-baidu": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-jd": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-kuaishou": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-lark": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-qq": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-toutiao": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-vue": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-weixin": "^2.0.2-3090520231028001",
    "@dcloudio/uni-mp-xhs": "^2.0.2-3090520231028001",
    "@dcloudio/uni-quickapp-native": "^2.0.2-3090520231028001",
    "@dcloudio/uni-quickapp-webview": "^2.0.2-3090520231028001",
    "@dcloudio/uni-stacktracey": "^2.0.2-3090520231028001",
    "@dcloudio/uni-stat": "^2.0.2-3090520231028001",
    "@vue/shared": "^3.0.0",
    "autoprefixer": "^8.0.0",
    "core-js": "^3.8.3",
    "flyio": "^0.6.2",
    "postcss": "^8.2.2",
    "postcss-loader": "^7.3.3",
    "vue": ">= 2.6.14 < 2.7",
    "vuex": "^3.2.0"
  },
  "devDependencies": {
    "@dcloudio/types": "^3.3.2",
    "@dcloudio/uni-automator": "^2.0.2-3090520231028001",
    "@dcloudio/uni-cli-i18n": "^2.0.2-3090520231028001",
    "@dcloudio/uni-cli-shared": "^2.0.2-3090520231028001",
    "@dcloudio/uni-helper-json": "*",
    "@dcloudio/uni-migration": "^2.0.2-3090520231028001",
    "@dcloudio/uni-template-compiler": "^2.0.2-3090520231028001",
    "@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.2-3090520231028001",
    "@dcloudio/vue-cli-plugin-uni": "^2.0.2-3090520231028001",
    "@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.2-3090520231028001",
    "@dcloudio/webpack-uni-mp-loader": "^2.0.2-3090520231028001",
    "@dcloudio/webpack-uni-pages-loader": "^2.0.2-3090520231028001",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "babel-plugin-import": "^1.11.0",
    "cross-env": "^7.0.2",
    "jest": "^25.4.0",
    "node-sass": "^4.14.1",
    "postcss-comment": "^2.0.0",
    "sass-loader": "^7.3.1",
    "vue-template-compiler": ">= 2.6.14 < 2.7"
  },
  "browserslist": [
    "Android >= 4.4",
    "ios >= 9"
  ],
  "uni-app": {
    "scripts": {}
  }
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1167673.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Antv/G2 图表坐标轴文字过长时添加省略号

// 格式化文字&#xff0c;超过长度添加省略号chart.axis(city, {label: {formatter: (text) > {// 字符太长添加省略号return text.length > 5 ? ${text.slice(0, 5)}... : text;}}})完整 demo&#xff1a; <!DOCTYPE html> <html lang"en"> &l…

Jetpack Compose 中下拉框实现

下拉菜单主要 以下三种实现&#xff1a; ExperimentalMaterialApi Composable fun ExposedDropdownMenuBox(expanded: Boolean,onExpandedChange: (Boolean) -> Unit,modifier: Modifier Modifier,content: Composable ExposedDropdownMenuBoxScope.() -> Unit )实现代…

云智慧联合北航提出智能运维(AIOps)大语言模型及评测基准

随着各行业数字化转型需求的不断提高&#xff0c;人工智能、云计算、大数据等新技术的应用已不仅仅是一个趋势。各行业企业和组织纷纷投入大量资源&#xff0c;以满足日益挑剔的市场需求&#xff0c;追求可持续性和竞争力&#xff0c;这也让运维行业迎来了前所未有的挑战和机遇…

Apollo云实验:使用Sim control仿真自动驾驶

使用Sim control仿真自动驾驶 概述Sim control仿真自动驾驶启动DreamView仿真系统 实验目的福利活动 主页传送门&#xff1a;&#x1f4c0; 传送 概述 自动驾驶汽车在实现落地应用前&#xff0c;需要经历大量的道路测试来验证算法的可行性和系统的稳定性&#xff0c;但道路测试…

内网穿透配置-Cpolar-Ngrok

文章目录 一、Cpolar1、cpolar软件的使用&#xff1a;&#xff08;1&#xff09;下载与安装&#xff08;2&#xff09;cpolar指定authtoken&#xff08;3&#xff09;获取临时域名&#xff08;4&#xff09;验证临时域名有效性 二、Ngrok1、配置内网穿透&#xff08;1&#xff…

数据挖掘题目:设ε= 2倍的格网间距,MinPts = 6, 采用基于1-范数距离的DBSCAN算法对下图中的实心格网点进行聚类,并给出聚类结果(代码解答)

问题 代码 import matplotlib.pyplot as plt import numpy as np from sklearn.cluster import DBSCAN #pip install matplotlib #pip install numpy #pip install scikit-learn # 实心格网点的坐标 solid_points np.array([[1, 1], [2, 1],[3, 1], [1, 2], [2, 2], [3, 2],[…

【蓝桥杯省赛真题41】Scratch电脑开关机 蓝桥杯少儿编程scratch图形化编程 蓝桥杯省赛真题讲解

目录 scratch电脑开关机 一、题目要求 编程实现 二、案例分析 1、角色分析

ucos_conf、ucos_src和ucos_port

目录 ucos_conf 文件夹ucos_src 文件夹ucos_port 文件夹 在 uC/OS-II 中&#xff0c;ucos_conf、ucos_src 和 ucos_port 是三个不同的文件夹&#xff0c;它们的作用和功能有所不同&#xff1a; ucos_conf 文件夹 ucos_conf 文件夹&#xff1a;ucos_conf 文件夹包含了 uC/OS-II…

高阶数据结构学习 —— 图(4)

文章目录 1、最短路径2、单源最短路径——Dijkstra算法&#xff08;正权值&#xff09;3、单源最短路径——BellmanFord算法1、BF优化&#xff1a;SPFA2、BF算法解决不了带负权回路的问题&#xff0c;实际上哪一个算法都无法求出来 4、多源最短路径——Floyd-Warshall算法 1、最…

汇编-注释

注释有两种说明方法&#xff1a; ●单行注释&#xff0c;用分号(&#xff1b;)开始。汇编器将忽略在同一行上分号之后的所有字符。 ●块注释&#xff0c; 用COMMENT伪指令和一个用户指定的符号开始。汇编器将忽略其后所有 的文本行&#xff0c;直到该用户指定的符号出现为止。…

让学生自助查询成绩的几种方法

在这个信息爆炸的时代&#xff0c;让学生能方便快捷的获取自己的成绩&#xff0c;无疑成为了老师们的一大挑战。我给各位老师介绍几种实用的方法&#xff0c;帮你实现在线发布成绩。 1. 使用在线表格或数据库 使用在线表格或数据库可以让你轻松地存储、管理和发布学生的成绩。…

Python接口自动化测试(接口状态)

本节开始&#xff0c;开始介绍python的接口自动化测试&#xff0c;首先需要搭建python开发环境&#xff0c;到https://www.python.org/下载python 版本直接安装就以了&#xff0c;建议 下载python2.7.11版本&#xff0c;当然&#xff0c;也是可以下载python最新版本的。 接口测…

课题学习(十)----阅读《基于数据融合的近钻头井眼轨迹参数动态测量方法》论文笔记

一、 引言 该论文针对三轴加速度计、磁通门和速率陀螺随钻测量系统&#xff0c;建立了基于四元数井眼轨迹参数测量模型&#xff0c;并依据状态方程和量测方程&#xff0c;应用2个扩卡尔曼滤波器、1个无迹卡尔曼滤波器和磁干扰校正系统对加速度计、磁通门信号进行滤波、校正&…

探索主题建模:使用LDA分析文本主题

在数据分析和文本挖掘领域&#xff0c;主题建模是一种强大的工具&#xff0c;用于自动发现文本数据中的隐藏主题。Latent Dirichlet Allocation&#xff08;LDA&#xff09;是主题建模的一种常用技术。本文将介绍如何使用Python和Gensim库执行LDA主题建模&#xff0c;并探讨主题…

什么是TCY油封?

机械由无数组件协同工作以确保平稳运行&#xff0c;其中一种不可或缺的部件是油封&#xff0c;特别是TCY油封。本文旨在阐明TCY油封的应用、其重要性以及它们如何提高机械的整体效率。 TCY油封主要用于轴密封。轴是一种旋转机器元件&#xff0c;横截面通常为圆形&#xff0c;用…

RAR Extractor v11.20(mac解压缩软件)

RAR Extractor是一款专门用于解压RAR格式压缩文件的软件&#xff0c;以下是关于RAR Extractor的详细介绍&#xff1a; 强大的解压功能&#xff1a;RAR Extractor能够解压RAR格式的压缩文件&#xff0c;无论是单一的RAR文件还是RAR文件包&#xff0c;都可以通过RAR Extractor进…

Python操作CMD大揭秘!轻松玩转命令行控制

导语&#xff1a; 命令行界面&#xff08;Command Line Interface&#xff0c;简称CLI&#xff09;是计算机操作系统中一种基于文本的用户界面&#xff0c;通过输入命令来与计算机进行交互。Python作为一门强大的编程语言&#xff0c;提供了丰富的库和模块&#xff0c;可以方便…

竖拍的视频怎么做二维码?竖版视频二维码制作技巧

为了方便视频的展示和传播&#xff0c;现在将视频生成二维码后来使用的方式越来越常见&#xff0c;很多做二维码工具都可以制作视频二维码&#xff0c;但是无法设置下载权限或者播放竖版视频。那么如果做有下载功能的视频码该如何制作&#xff0c;可能很多小伙伴都不知道怎么做…

(免费领源码)java#springboot#mysql网上商城系统的设计与实现08789-计算机毕业设计项目选题推荐

摘 要 随着互联网趋势的到来&#xff0c;各行各业都在考虑利用互联网将自己推广出去&#xff0c;最好方式就是建立自己的互联网系统&#xff0c;并对其进行维护和管理。在现实运用中&#xff0c;应用软件的工作规则和开发步骤&#xff0c;采用Java技术建设网上商城系统。 本设…

Google play开发者账号注册的实用技巧与建议——身份验证、付款资料、支付成功注册失败?

总所周知&#xff0c;如果要在Google paly应用商店上发布应用&#xff0c;需要先注册谷歌开发者账号。但随着发展&#xff0c;谷歌对开发者账号的审核越来越严格&#xff0c;要求越来越多&#xff0c;账号注册通过率越来越低&#xff0c;频繁被封&#xff0c;令开发者们苦恼不已…