Vue2 neues Projekt (2)

Der Inhalt dieses Artikels besteht hauptsächlich darin, die Schnittstelle zu schreiben

Seiteninhalte hinzufügen

Fügen Sie Variablen und Funktionen hinzu

axi installieren

Anrufschnittstelle

Führen Sie es erfolgreich aus, packen Sie es und probieren Sie es aus. Führen Sie npm run build aus und stellen Sie fest, dass ein Fehler

gemeldet wird, weil wir vue.config.js nicht konfiguriert haben.
Laden Sie zuerst die Pfadabhängigkeit herunter, führen Sie npm install --save path aus
und erstellen Sie es dann die Datei vue.config.js

Der Code lautet wie folgt:

const path = require("path");
function resolve(dir) {
    
    
  return path.join(__dirname, dir);
}

module.exports = {
    
    
  // 是否开启eslint保存检测，有效值：ture | false | "error"
  lintOnSave: false,

  // 运行时版本是否需要编译
  runtimeCompiler: true,

  // 默认babel-loader忽略mode_modules，这里可增加例外的依赖包名
  transpileDependencies: [],

  // 是否在构建生产包时生成 sourceMap 文件，false将提高构建速度
  productionSourceMap: false,

  css: {
    
    
    loaderOptions: {
    
    
      sass: {
    
    
        data: "",
      },
    },
  },

  pluginOptions: {
    
    
    // 第三方插件配置
  },

  pwa: {
    
    
    // 单页插件相关配置 https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
  },

  configureWebpack: {
    
    
    externals: {
    
    
      BMap: "BMap",
    },
  },

  chainWebpack: (config) => {
    
    
    config.resolve.alias
      // .set("@", resolve("src"))
      // .set("components", resolve("src/components"));
      .set("@", resolve("src"))
      .set("public", resolve("public"))
      .set("view", resolve("src/view"))
      .set("assets", resolve("src/assets"))
      .set("components", resolve("src/components"))
      .set("styles", resolve("src/styles"))
      .set("methods", resolve("src/methods"));
  },
  devServer: {
    
    
    open: false,
    host: "0.0.0.0",
    port: 9991,
    https: false,
    hotOnly: false,
    // proxy: null,
    proxy: {
    
    
      "/api": {
    
    
        target: "***你的接口地址***", // 生产环境
        changeOrigin: true,
        pathRewrite: {
    
    
          "^/api": "",
        },
      },
    
    },
  },
  publicPath: "./",
};

Sie sind fertig