vue项目根据不同环境进行设置打包命令的方法

npm install --save-dev cross-env

  "scripts": {
    "dev": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

  "scripts": {
    "dev": "vue-cli-service serve --open --port 9090",
    "build": "vue-cli-service build",
    "build:test": "vue-cli-service build --mode test",
    "build:prod": "vue-cli-service build --mode prod",
    "lint": "vue-cli-service lint"
  },

#定义NODE_ENV变量
NODE_ENV=prod

#定义NODE_ENV变量
NODE_ENV=test

const { defineConfig } = require("@vue/cli-service");
const os = require("os");

const { NODE_ENV } = process.env;

///获取本机ip///
function getIPAdress() {
  const interfaces = os.networkInterfaces();
  for (let devName in interfaces) {
    let iface = interfaces[devName];
    for (let i = 0; i < iface.length; i++) {
      let alias = iface[i];
      if (
        alias.family === "IPv4" &&
        alias.address !== "127.0.0.1" &&
        !alias.internal
      ) {
        return alias.address;
      }
    }
  }
}
const myHost = getIPAdress();
console.log("myHost", myHost);
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    host: myHost, //配置本地host,当启动项目时自动在浏览器中打开
  },
  outputDir: NODE_ENV ? `${NODE_ENV}-dist` : "dist",//不同的环境打包输出到不同的目录
});

#执行命令，打包的文件直接输出到项目下的dist目录
npm run build 

#执行命令，打包的文件直接输出到项目下的test-dist目录
npm run build:test 

#执行命令，打包的文件直接输出到项目下的prod-dist目录
npm run build :prod

#启动命令，会自动在浏览器中打开端口号为9090的本地ip的页面
npm run dev

vue-cli-service serve [options] [entry]

 "dev": "vue-cli-service serve --open --host localhost",

"dev": "vue-cli-service serve --open --port 9090",

const os = require("os");

const { NODE_ENV } = process.env;

///获取本机ip
function getIPAdress() {
  const interfaces = os.networkInterfaces();
  for (let devName in interfaces) {
    let iface = interfaces[devName];
    for (let i = 0; i < iface.length; i++) {
      let alias = iface[i];
      if (
        alias.family === "IPv4" &&
        alias.address !== "127.0.0.1" &&
        !alias.internal
      ) {
        return alias.address;
      }
    }
  }
}
const myHost = getIPAdress();//本机ip


module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    host: myHost, //配置本地host,当启动项目时自动在浏览器中打开
  },
  outputDir: NODE_ENV ? `${NODE_ENV}-dist` : "dist",
});

vue-cli-service build

vue-cli-service build [options] [entry|pattern]