uni-app vue-cli typescript 编译h5页面

3pvhb19x  于 2022-10-20  发布在  uni-app
关注(0)|答案(1)|浏览(313)
  • 问题描述**

[问题描述:vue-cli 命令编译H5项目访问空白页面(我是起了服务的),小程序正常

配置文件
pages.json
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "登录"
}
},
{
"path": "pages/home/home",
"style": {
"navigationBarTitleText": "首页",
"navigationStyle": "custom",
"enablePullDownRefresh": true
}
},
{
"path": "pages/maps/maps",
"style": {
"navigationBarTitleText": "企业设备"
}
},
{
"path": "pages/learning/learning",
"style": {
"navigationBarTitleText": "消防知识"
}
},
{
"path": "pages/mine/mine",
"style": {
"navigationBarTitleText": "我的",
"navigationStyle": "custom"
}
}
],
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#2ca2fa",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"height": "50px",
"fontSize": "10px",
"iconWidth": "24px",
"spacing": "3px",
"list": [
{
"pagePath": "pages/home/home",
"iconPath": "static/icons/devops/icon_sy.png",
"selectedIconPath": "static/icons/devops/icon_sy_full.png",
"text": "首页"
},
{
"pagePath": "pages/maps/maps",
"iconPath": "static/icons/devops/icon_qydt.png",
"selectedIconPath": "static/icons/devops/icon_qydt_full.png",
"text": "企业Map"
},
{
"pagePath": "pages/learning/learning",
"iconPath": "static/icons/devops/icon_xfzs.png",
"selectedIconPath": "static/icons/devops/icon_xfzs_full.png",
"text": "消防知识"
},
{
"pagePath": "pages/mine/mine",
"iconPath": "static/icons/devops/icon_mine.png",
"selectedIconPath": "static/icons/devops/icon_mine_full.png",
"text": "我的"
}
],
"midButton": {
"width": "80px",
"height": "50px",
"text": "文字",
"iconPath": "static/icons/devops/icon_mine.png",
"iconWidth": "24px",
"backgroundImage": "static/icons/devops/icon_mine.png"
}
},
"subPackages": [

{
		"root": "operation",
		"pages": [
			{
				"path": "home/home",
				"style": {
					"navigationBarTitleText": "首页"
				}
			}
		]
	},

	{
		"root": "other",
		"pages": [
			{
				"path": "protocol/protocol",
				"style": {
					"navigationBarTitleText": "用户协议"
				}
			},
			{
				"path": "findpwd/findpwd",
				"style": {
					"navigationBarTitleText": "找回密码"
				}
			}
		]
	}
],
"easycom": {
	"autoscan": true,
	"custom": {
		"^nom-(.*)": "@/components/public/nom-$1.vue"
	}
},
"globalStyle": {
	"navigationBarTextStyle": "black",
	"navigationBarTitleText": "uni-app",
	"navigationBarBackgroundColor": "#ffffff",
	"backgroundColor": "#F8F8F8",
	"pageOrientation": "auto",
	"renderingMode": "seperated",
	"rpxCalcMaxDeviceWidth": 960,
	"rpxCalcBaseDeviceWidth": 375,
	"rpxCalcIncludeWidth": 750,
	"mp-weixin": {
		"requiredPrivateInfos": [
			"chooseAddress",
			"chooseLocation",
			"choosePoi",
			"getFuzzyLocation",
			"getLocation",
			"onLocationChange",
			"startLocationUpdate",
			"startLocationUpdateBackground"
		]
	}
}

}
package.json
{
"name": "pine_fire",
"version": "0.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: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: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-plus": "^2.0.1-35320220729002",
"@dcloudio/uni-h5": "^2.0.1-35320220729002",
"@dcloudio/uni-helper-json": "",
"@dcloudio/uni-i18n": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-360": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-alipay": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-baidu": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-jd": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-kuaishou": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-lark": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-qq": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-toutiao": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-vue": "^2.0.1-35320220729002",
"@dcloudio/uni-mp-weixin": "^2.0.1-35320220729002",
"@dcloudio/uni-quickapp-native": "^2.0.1-35320220729002",
"@dcloudio/uni-quickapp-webview": "^2.0.1-35320220729002",
"@dcloudio/uni-stat": "^2.0.1-35320220729002",
"@vue/shared": "^3.2.37",
"core-js": "^3.24.1",
"flyio": "^0.6.2",
"node-sass": "^7.0.1",
"regenerator-runtime": "^0.12.1",
"sass": "^1.54.4",
"sass-loader": "^12.6.0",
"vue": "^2.7.8",
"vue-class-component": "^6.3.2",
"vue-property-decorator": "^8.5.1",
"vuex": "^3.2.0",
"vuex-module-decorators": "^2.0.0"
},
"devDependencies": {
"@babel/plugin-syntax-typescript": "^7.18.6",
"@babel/runtime": "~7.12.0",
"@dcloudio/types": "^2.6.12",
"@dcloudio/uni-automator": "^2.0.1-36420220922001",
"@dcloudio/uni-cli-i18n": "^2.0.1-36420220922001",
"@dcloudio/uni-cli-shared": "^2.0.1-36420220922001",
"@dcloudio/uni-migration": "^2.0.1-36420220922001",
"@dcloudio/uni-template-compiler": "^2.0.1-36420220922001",
"@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.1-36420220922001",
"@dcloudio/vue-cli-plugin-uni": "^2.0.1-36420220922001",
"@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.1-36420220922001",
"@dcloudio/webpack-uni-mp-loader": "^2.0.1-36420220922001",
"@dcloudio/webpack-uni-pages-loader": "^2.0.1-36420220922001",
"@vue/cli-plugin-babel": "^4.5.19",
"@vue/cli-plugin-typescript": "^4.5.19",
"@vue/cli-service": "^4.5.19",
"babel-plugin-import": "^1.13.5",
"cross-env": "^7.0.2",
"jest": "^25.4.0",
"mini-types": "
",
"miniprogram-api-typings": "^3.6.0",
"postcss-comment": "^2.0.0",
"typescript": "^3.0.0",
"vue-template-compiler": "^2.7.10"
},
"browserslist": [
"Android >= 4.4",
"ios >= 9"
],
"uni-app": {
"scripts": {}
},
"description": "## Project setup npm install ",
"main": "babel.config.js",
"author": "",
"license": "ISC"
}
App.vue

index.vue

8ftvxx2r

8ftvxx2r1#

新创建一个工程测试一下是否正常

另外查看浏览器控制台是否有报错

相关问题