Vue2.0は適応解像度を実装する

'@/utils/flexibleEx.js' をインポートします

(関数(win, lib) {
  var doc = win.document
  var docEl = doc.documentElement
  var metaEl = doc.querySelector('meta[name="viewport"]')
  var フレキシブルEl = doc.querySelector('meta[name="フレキシブル"]')
  var dpr = 0
  varスケール = 0
  var tid
  var フレキシブル = lib.フレキシブル || (lib.フレキシブル = {})
 
  if (メタEl) {
    console.warn('ズーム率は既存のメタタグに従って設定されます')
    var マッチ = metaEl
      .getAttribute('コンテンツ')
      .match(/initial\-scale=([\d\.]+)/)
    （一致）の場合{
      スケール = parseFloat(match[1])
      dpr = parseInt(1 / スケール)
    }
  } そうでない場合 (flexibleEl) {
    var コンテンツ = FlexibleEl.getAttribute('コンテンツ')
    if (コンテンツ) {
      var initialDpr = content.match(/initial\-dpr=([\d\.]+)/)
      var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/)
      （初期Dpr）の場合{
        dpr = parseFloat(初期Dpr[1])
        スケール = parseFloat((1 / dpr).toFixed(2))
      }
      （最大Dpr）の場合{
        dpr = parseFloat(最大Dpr[1])
        スケール = parseFloat((1 / dpr).toFixed(2))
      }
    }
  }
 
  （！dpr && ！スケール）{
    var isAndroid = win.navigator.appVersion.match(/android/gi)
    var isIPhone = win.navigator.appVersion.match(/iphone/gi)
    var デバイスピクセル比 = win.デバイスピクセル比
    if (isIPhone) {
      // iOS では、2 画面と 3 画面の場合は 2 倍のソリューションを使用し、それ以外の場合は 1 倍のソリューションを使用します if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
        dpr = 3
      } そうでない場合 (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
        dpr = 2
      } それ以外 {
        dpr = 1
      }
    } それ以外 {
      // 他のデバイスでは、1xソリューションが引き続き使用されますdpr = 1
    }
    スケール = 1 / dpr
  }
 
  docEl.setAttribute('data-dpr', dpr)
  if (!metaEl) {
    metaEl = doc.createElement('meta')
    metaEl.setAttribute('名前', 'ビューポート')
    メタEl.setAttribute()
      'コンテンツ'、
      '初期スケール=' +
            スケール +
            ', 最大スケール=' +
            スケール +
            ', 最小スケール=' +
            スケール +
            '、ユーザースケーラブル=いいえ'
    ）
    docEl.firstElementChildの場合{
      docEl.firstElementChild.appendChild(metaEl)
    } それ以外 {
      var wrap = doc.createElement('div')
      wrap.appendChild(メタEl)
      doc.write(wrap.innerHTML)
    }
  }
 
  関数refreshRem() {
    定数ホワイトリスト = [
      '/managementKanban',
      '/productionKanban',
      '/コントロールボード',
      '/主要'
    ] // ホワイトリストルートをリダイレクトしない var width = docEl.getBoundingClientRect().width
    var rem = 0
 
    var hrefList = window.location.href.split('/')
    var url = hrefList[hrefList.length - 1]
    var url0 = url.split('?')
    var url終了
    url0.length > 0 の場合 {
      urlEnd = url0[0]
    }
    if (!whiteList.includes('/' + urlEnd)) {
      幅 / dpr <= 1980 && 幅 / dpr > 768 の場合 {
        幅 = 1980 * dpr
        rem = 幅 / 48
      } そうでない場合 (幅 / dpr >= 5760) {
        幅 = 5760 * dpr
        rem = 幅 / 48
      } それ以外 {
        幅 = 540 * dpr
        rem = 幅 / 20
      }
      docEl.style.fontSize = rem + 'px'
      フレキシブル.rem = win.rem = rem
    }
  }
 
  win.addEventListener() 関数は、
    「サイズ変更」、
    関数（） {
      クリアタイムアウト(tid)
      tid = setTimeout(リフレッシュ間隔、300)
    },
    間違い
  ）
  win.addEventListener() 関数は、
    'DOMNodeInserted'、
    関数（） {
      クリアタイムアウト(tid)
      tid = setTimeout(リフレッシュ間隔、50)
    },
    間違い
  ）
  win.addEventListener() 関数は、
    'ページ表示',
    関数(e) {
      if (e.persisted) {
        クリアタイムアウト(tid)
        tid = setTimeout(リフレッシュ間隔、300)
      }
    },
    間違い
  ）
 
  doc.readyState === '完了'の場合{
    doc.body.style.fontSize = 12 * dpr + 'px'
  } それ以外 {
    doc.addEventListener() 関数は、
      'DOMコンテンツがロードされました'、
      関数(e) {
        doc.body.style.fontSize = 12 * dpr + 'px'
      },
      間違い
    ）
  }
 
  リフレッシュRem()
 
  フレキシブル.dpr = win.dpr = dpr
  フレキシブル.refreshRem = リフレッシュRem
  フレキシブル.rem2px = 関数(d) {
    var val = parseFloat(d) * this.rem
    （typeof d === 'string' && d.match(/rem$/)）の場合{
      val += 'px'
    }
    戻り値
  }
  フレキシブル.px2rem = 関数(d) {
    var val = parseFloat(d) / this.rem
    if (typeof d === 'string' && d.match(/px$/)) {
      val += 'rem'
    }
    戻り値
  }
})(ウィンドウ、ウィンドウ['lib'] || (ウィンドウ['lib'] = {}))

関数generateLoaders(loader, loaderOptions) {
    const loaders = options.usePostCSS ? [cssLoader] : [cssLoader];
 
    if (ローダー) {
      ローダー.push({
        ローダー: ローダー + "-loader"、
        オプション: Object.assign({}, loaderOptions, {
          ソースマップ: options.sourceMap
        })
      });
    }
 
    // そのオプションが指定されている場合はCSSを抽出します
    // (本番ビルドの場合)
    if (オプション.抽出) {
      戻り値: ExtractTextPlugin.extract({
        使用: ローダー、
        フォールバック: "vue-style-loader",
        パブリックパス: "../../"
      });
    } それ以外 {
      ["vue-style-loader"].concat(loaders) を返します。
    }
  }

モジュール.エクスポート = {
    プラグイン: {
        '自動プレフィックス': {
            オーバーライドブラウザリスト: [
                「Android 4.1」、
                「iOS 7.1」、
                「Chrome > 31」、
                'ff > 31',
                「つまり >= 8」
            ]
        },
        'postcss-pxtorem': {
            ルート値: 37.5,
            プロップリスト: ['*']
        }
    }
}