The problem that the page is blank after the vue-CLI creation item is packed is solved

  1. Command line: NPM run build

After packaging, there will be a folder dist in the project, which is our packaged project.

Vue. Config. js file will be generated automatically after the package is completed

The configuration is as follows:

const path = require("path");
const resolve = function(dir) {
  return path.join(__dirname, dir);
};
module.exports = {
  publicPath: process.env.NODE_ENV === "production" ? ". /" : ". /".outputDir: "dist".assetsDir: "static".lintOnSave: true.// Whether to enable esLint save detection
  productionSourceMap: false.// Whether sourcdeMap is generated when the production package is built
  chainWebpack: config= > {
    config.resolve.alias
      .set("@", resolve("src"))
      .set("@v", resolve("src/views"))
      .set("@c", resolve("src/components"))
      .set("@u", resolve("src/utils"))
      .set("@s", resolve("src/service")); /* Alias configuration */
    config.optimization.runtimeChunk("single");
  },
  devServer: {
    // host: "localhost",
    /* Local IP address */
    / / host: "192.168.1.107,"
    host: "0.0.0.0".// LAN and local access
    port: "8080".hot: true./* Automatically opens the browser */
    open: false.overlay: {
      warning: false.error: true
    },
    /* Cross-domain proxy */
    proxy: {
      "/api": {
        /* Destination proxy server address */
        target: "http://m260048y71.zicp.vip".//
        / / target: "http://192.168.1.102:8888", / /
        /* Allows cross-domain */
        changeOrigin: true.ws: true.pathRewrite: {
          "^/api": ""}}}}};Copy the code

The third problem is that the contents of the router-View are not displayed. Route History mode

When you open the route history mode without the support of the backend, the packaged file will also be blank.

Error: Comment mode: history out of router.js

The valuable config.js file is worth saving