Skip to content

打包后部分页面json无usingComponents,导致页面页面引用组件不渲染 #117

@GreenyZD

Description

@GreenyZD
  1. 使用vue init F-loat/mpvue-quickstart my-projectt构建项目

  2. package.json

{
  "name": "jgMiniProgram",
  "version": "1.0.0",
  "description": "jgMiniProgram",
  "author": "50524",
  "private": true,
  "scripts": {
    "dev": "node build/dev-server.js",
    "start": "node build/dev-server.js",
    "build": "node build/build.js",
    "lint": "eslint --ext .js,.vue src",
    "lint:fix": "eslint --ext .js,.vue src --fix"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "minapp-api-promise": "^1.0.2",
    "mpvue": "^1.0.0",
    "vuex": "^3.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-eslint": "^8.2.0",
    "babel-loader": "^7.1.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-2": "^6.22.0",
    "babel-register": "^6.22.0",
    "chalk": "^2.4.0",
    "copy-webpack-plugin": "^4.5.0",
    "css-loader": "^0.28.0",
    "cssnano": "^3.10.0",
    "eslint": "^4.19.0",
    "eslint-config-standard": "^11.0.0",
    "eslint-friendly-formatter": "^4.0.0",
    "eslint-loader": "^2.0.0",
    "eslint-plugin-html": "^4.0.0",
    "eslint-plugin-import": "^2.11.0",
    "eslint-plugin-node": "^6.0.0",
    "eslint-plugin-promise": "^3.4.0",
    "eslint-plugin-standard": "^3.0.0",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^1.1.0",
    "friendly-errors-webpack-plugin": "^1.7.0",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "mpvue-config-loader": "^0.1.0",
    "mpvue-entry": "next",
    "mpvue-loader": "^1.1.2",
    "mpvue-router-patch": "^0.2.0",
    "mpvue-template-compiler": "^1.0.0",
    "mpvue-webpack-target": "^1.0.0",
    "optimize-css-assets-webpack-plugin": "^3.2.0",
    "ora": "^2.0.0",
    "postcss-loader": "^2.1.0",
    "postcss-mpvue-wxss": "^1.0.0",
    "prettier": "~1.12.0",
    "px2rpx-loader": "^0.1.0",
    "qs": "^6.6.0",
    "rimraf": "^2.6.0",
    "semver": "^5.3.0",
    "shelljs": "^0.8.0",
    "uglifyjs-webpack-plugin": "^1.2.0",
    "url-loader": "^1.0.0",
    "vant-weapp": "^0.5.10",
    "vue-style-loader": "^4.1.0",
    "webpack": "^3.11.0",
    "webpack-bundle-analyzer": "^2.13.0",
    "webpack-dev-middleware-hard-disk": "^1.12.0",
    "webpack-merge": "^4.1.0",
    "webpack-mpvue-asset-plugin": "^0.1.0"
  },
  "engines": {
    "node": ">= 4.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}
  1. app.vue全局配置
globalConfig: {
    usingComponents: {
      'van-field': '/static/vant-weapp/dist/field/index',
      'van-icon': '/static/vant-weapp/dist/icon/index',
      'van-tag': '/static/vant-weapp/dist/tag/index',
      'van-button': '/static/vant-weapp/dist/button/index',
      'van-cell-group': '/static/vant-weapp/dist/cell-group/index',
      'van-cell': '/static/vant-weapp/dist/cell/index',
      'van-action-sheet': '/static/vant-weapp/dist/action-sheet/index',
      'van-dialog': '/static/vant-weapp/dist/dialog/index',
      'van-search': '/static/vant-weapp/dist/search/index',
      'van-toast': '/static/vant-weapp/dist/toast/index',
      'van-popup': '/static/vant-weapp/dist/popup/index',
      'van-picker': '/static/vant-weapp/dist/picker/index',
      'van-datetime-picker': '/static/vant-weapp/dist/datetime-picker/index',
      'van-swipe-cell': '/static/vant-weapp/dist/swipe-cell/index',
      'van-notice-bar': '/static/vant-weapp/dist/notice-bar/index',
      'van-notify': '/static/vant-weapp/dist/notify/index',
      'van-tab': '/static/vant-weapp/dist/tab/index',
      'van-tabs': '/static/vant-weapp/dist/tabs/index',
      'van-switch-cell': '/static/vant-weapp/dist/switch-cell/index'
    }
  },
  1. 某页面JSON文件
    npm run build
{
  "navigationBarTitleText": "电动车通行"
}

npm run dev

{
  "usingComponents": {
    "van-field": "/static/vant-weapp/dist/field/index",
    "van-icon": "/static/vant-weapp/dist/icon/index",
    "van-tag": "/static/vant-weapp/dist/tag/index",
    "van-button": "/static/vant-weapp/dist/button/index",
    "van-cell-group": "/static/vant-weapp/dist/cell-group/index",
    "van-cell": "/static/vant-weapp/dist/cell/index",
    "van-action-sheet": "/static/vant-weapp/dist/action-sheet/index",
    "van-dialog": "/static/vant-weapp/dist/dialog/index",
    "van-search": "/static/vant-weapp/dist/search/index",
    "van-toast": "/static/vant-weapp/dist/toast/index",
    "van-popup": "/static/vant-weapp/dist/popup/index",
    "van-picker": "/static/vant-weapp/dist/picker/index",
    "van-datetime-picker": "/static/vant-weapp/dist/datetime-picker/index",
    "van-swipe-cell": "/static/vant-weapp/dist/swipe-cell/index",
    "van-notice-bar": "/static/vant-weapp/dist/notice-bar/index",
    "van-notify": "/static/vant-weapp/dist/notify/index",
    "van-tab": "/static/vant-weapp/dist/tab/index",
    "van-tabs": "/static/vant-weapp/dist/tabs/index",
    "van-switch-cell": "/static/vant-weapp/dist/switch-cell/index"
  },
  "navigationBarTitleText": "电动车通行"
}
  1. 页面表现(npm run build)
    页面
    image
    wxml
    image
  2. 正常表现(npm run dev)
    页面
    image
    wxml
    image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions