компонент мигает и исчезает при использовании версии сборки vue (без проблем при обслуживании) - PullRequest
Новая
       34

компонент мигает и исчезает при использовании версии сборки vue (без проблем при обслуживании)

0 голосов
/ 09 июля 2019

У меня есть приложение VUE.Когда я использую vue-cli для локального обслуживания (vue-cli-service serve), приложение работает нормально.

Если я строю как веб-компонент: vue-cli-service build --target wc --name my-app ./src/App.vue

и смотрю на сгенерированную демонстрацию.HTML-страница в папке dist, компонент рендеринга;однако, если я нажимаю на поле ввода, чтобы использовать компонент выбора даты (я пробовал 3 разных, и у всех есть эта проблема, поэтому мне интересно, если есть проблема с шагом сборки), компонент открывается инемедленно закрывается.

Если я переключаю вкладки и возвращаюсь на вкладку demo.html, средство выбора даты закрывается.

Лучше всего показать проблему в видео: https://www.youtube.com/watch?v=OgUYDasUjlo&feature=youtu.be

Я пробовал vue-ctk-date-time-picker и vue-date-pick компоненты и один другой, и все это дает мне эту проблему.

Я пытался войти в событие "close" для этих компонентов, иЯ вижу это много, много раз.Я мог бы переключать вкладки и возвращаться в demo.html, и закрывать события 30 раз.Трудно увидеть, что здесь происходит, поскольку нет сообщений об ошибках.

Component vue 

          <b-row class="mt-3">
            <b-col lg="1"></b-col>
            <b-col cols="4">
              <b-form-group label-cols-sm="3" label="Schedule" label-align-sm="right" label-class="font-weight-bold pt-0" class="mb-0">                
                <DatePick 
                v-model="selectedDate"
                ></DatePick>
              </b-form-group>
            </b-col>
          </b-row>

package.json: 

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build:dev": "vue-cli-service build --target wc --name my-app ./src/App-Main.vue",
    "lint": "vue-cli-service lint",
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "bootstrap": "^4.3.1",
    "bootstrap-vue": "^2.0.0-rc.25",
    "core-js": "^2.6.5",
    "swagger-client": "^3.9.0",
    "vue": "^2.6.10",
    "vue-class-component": "^7.0.2",
    "vue-ctk-date-time-picker": "^2.1.1",
    "vue-date-pick": "^1.1.0",
    "vue-moment": "^4.0.0",
    "vue-multiselect": "^2.1.6",
    "vue-property-decorator": "^8.1.0"
  },
  "devDependencies": {
    "@types/jest": "^23.1.4",
    "@vue/cli-plugin-babel": "^3.9.2",
    "@vue/cli-plugin-typescript": "^3.9.0",
    "@vue/cli-plugin-unit-jest": "^3.9.0",
    "@vue/cli-service": "^3.9.2",
    "@vue/test-utils": "1.0.0-beta.29",
    "babel-core": "7.0.0-bridge.0",
    "node-sass": "^4.12.0",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.1",
    "ts-jest": "^23.0.0",
    "ts-loader": "^6.0.4",
    "typescript": "^3.5.2",
    "vue-template-compiler": "^2.6.10"
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ],
  "jest": {
    "moduleFileExtensions": [
      "js",
      "jsx",
      "json",
      "vue",
      "ts",
      "tsx"
    ],
    "transform": {
      "^.+\\.vue$": "vue-jest",
      ".+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$": "jest-transform-stub",
      "^.+\\.tsx?$": "ts-jest"
    },
    "transformIgnorePatterns": [
      "/node_modules/"
    ],
    "moduleNameMapper": {
      "^@/(.*)$": "<rootDir>/src/$1"
    },
    "snapshotSerializers": [
      "jest-serializer-vue"
    ],
    "testMatch": [
      "**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"
    ],
    "testURL": "http://localhost/",
    "watchPlugins": [
      "jest-watch-typeahead/filename",
      "jest-watch-typeahead/testname"
    ],
    "globals": {
      "ts-jest": {
        "babelConfig": true
      }
    }
  }
}

В консоли нет ошибок.

...