Detaillierte Erläuterung des adaptiven Anpassungsproblems des Vue-Mobilterminals

// Basisgröße const baseSize = 32
// Setze die Rem-Funktion function setRem () {
  // Das Skalierungsverhältnis der aktuellen Seitenbreite im Verhältnis zur Breite 750, das nach Bedarf geändert werden kann.
  const scale = document.documentElement.clientWidth / 750
  // Schriftgröße des Stammknotens der Seite festlegen document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'
}
// setRem() initialisieren
//Reset rem beim Ändern der Fenstergröße
Fenster.onresize = Funktion () {
  setRem()
} 

importiere './utils/rem' 

npm installiere postcss-pxtorem -D 

modul.exporte = {
  "Plugins": {
    "postcss-import": {},
    "postcss-url": {},
    // um Zielbrowser zu bearbeiten: verwenden Sie das Feld „browserslist“ in package.json
    "Autopräfixer": {},
    "postcss-pxtorem": {
      "RootValue": 32,
      "Eigenschaftenliste": ["*"]
    }
  }
} 

modul.exporte = { 
  //Doppelklicken Sie auf die Datei index.html, um sie direkt auszuführen publicPath: './',
  // Das Verzeichnis für die Build-Dateien der Produktionsumgebung, die beim Ausführen von vue-cli-service build outputDir generiert werden: 'dist',
  lintOnSave: wahr,
  // Ob ein Vue-Build verwendet werden soll, der einen Laufzeitcompiler enthält. Nach dem Setzen von true können Sie die Vorlage verwenden
  LaufzeitCompiler: true,
  // Ob eine SourceMap-Datei in der Produktionsumgebung generiert werden soll. Einzelheiten zu SourceMap finden Sie am Ende der Produktion. SourceMap: false,
  konfigurierenWebpack: config => {
    if (process.env.NODE_ENV === 'production') { // Konfiguration für Produktionsumgebung ändern...
      zurückkehren {

      }
    } anders {
      zurückkehren {

      }
    }
  },
  css: {
    extract: true, // CSS-Quellzuordnungen aktivieren?
    sourceMap: false, // CSS-Vorgabekonfigurationselemente module: false,
    loaderOptions: {
      postcss: {
        Plugins: [
          erfordern('postcss-pxtorem')({
            rootValue: 37.5, // Basis der Konvertierung selectorBlackList: ['weui', 'mu'], // Konvertierung ignorieren reguläre passende Elemente propList: ['*']
          })
        ]
      }
    }
  },

  // webpack-dev-server-bezogene Konfiguration devServer: { // Proxy festlegen hot: true, // Hot load host: '0.0.0.0', // IP-Adresse Port: 8082, // Port https: false, // false deaktiviert https, true aktiviert es open: true, // Browser-Overlay automatisch öffnen: {
      Warnungen: falsch,
      Fehler: falsch
    }
  }
}