tis_platform/vue.config.js

const path = require("path");
// const { name } = require("./package");
const uc = require("upper-case");
const loadSdkPlugin = require("./webpack_plugins/tis-loadsdk-plugin");
const pxtoviewport = require("postcss-px-to-viewport");
// const injectSdks = require('./webpack_plugins/tis-inject-sdk')
// const createTisplatformPlugin =require('./webpack_plugins/tis-create-manifest');
function resolve(dir) {
  return path.join(__dirname, dir);
}

const port = 7000; // dev port
const ROOT_DIR_NAME = resolve("").split(path.sep).pop();
const name = uc(ROOT_DIR_NAME);

module.exports = {
  /**
   * You will need to set publicPath if you plan to deploy your site under a sub path,
   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
   * then publicPath should be set to "/bar/".
   * In most cases please use '/' !!!
   * Detail: https://cli.vuejs.org/config/#publicpath
   */
  productionSourceMap: process.env.VUE_APP_DEBUG === "debug" || process.env.NODE_ENV === "development",
  publicPath: `/${name}/`,
  outputDir: `dist/${name}`,
  // assetsDir: "static",
  filenameHashing: false,
  // tweak internal webpack configuration.
  // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
  devServer: {
    // host: '0.0.0.0',
    hot: true,
    disableHostCheck: true,
    // port,
    overlay: {
      warnings: false,
      errors: true
    },
    headers: {
      "Access-Control-Allow-Origin": "*"
    },
    contentBase: ["lib", "sdk"],
    proxy: {
      "/ws/": {
        target: "ws://localhost:9999/",
        ws: true,
        changeOrigin: true
        // pathRewrite:{
        //   "^/ws":"ws://10.12.16.173:3806/ws/ch1"
        // }http://10.12.16.219
      },
      "/tisstfw/": {
        target: "http://10.12.16.219:3806",
        changeOrigin: true
      },
      "/TIS_COMPONENT_MAP2D": {
        target: "http://localhost:7001",
        changeOrigin: true
      },
      "/KT_SJDB": {
        target: "http://localhost:7000",
        changeOrigin: true
      },
      "/KeyLogin/": {
        target: "http://10.12.16.219:3806",
        changeOrigin: true
      },
      "/207S_MLYY/": {
        target: "http://10.12.16.219:3806",
        changeOrigin: true
      },
      "/tisframework/": {
        target: "http://10.12.16.219:3806",
        changeOrigin: true
      },
      "/tisyhgl/": {
        target: "http://10.12.18.100:3806",
        changeOrigin: true
      }

    }
  },
  lintOnSave: false,
  // chainWebpack:config=>{
  //   config.plugins.delete('prefetch')
  // },
  // 自定义webpack配置
  configureWebpack: {
    externals: {
      "tisui": "TIS",//
      "vue": {
        root: "Vue",
        commonjs: "vue",
        commonjs2: "vue",
        amd: "vue"
      }
    },
    output: {
      // 把子应用打包成 umd 库格式
      library: `${name}-[name]`,
      libraryTarget: "umd",
      jsonpFunction: `webpackJsonp_${name}`
    },
    resolve: {
      alias: {
        "@": resolve("src")
      }
    },
    plugins: [
      new loadSdkPlugin({ sdkPath: "sdk", jsonPath: "sdk" })
      // new injectSdks({path: path.resolve(`dist/${name}`),sdkName:name}),
      // new createTisplatformPlugin({path: path.resolve(`dist/${name}`),sdkName:name})
    ],

  },
  css:{
    loaderOptions:{
      postcss:{
        plugins:[
          pxtoviewport({
            // options
            unitToConvert: 'px',//(String) 需要转换的单位，默认为"px"
            viewportWidth: 1920, // (Number) 设计稿的视口宽度 pc 1600 pad/pc 1920 mobile 3120
            unitPrecision: 3, //  (Number) 单位转换后保留的精度（很多时候无法整除）
            viewportUnit: 'vw', // (String) 希望使用的视口单位
            selectorBlackList: ['.ignore', '.hairlines', 'LoginPage'],
            /*(Array) 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位
            如果传入的值为字符串的话，只要选择器中含有传入值就会被匹配
                例如 selectorBlackList 为 ['body'] 的话， 那么 .body-class 就会被忽略
            如果传入的值为正则表达式的话，那么就会依据CSS选择器是否匹配该正则
                例如 selectorBlackList 为 [/^body$/] , 那么 body 会被忽略，而 .body 不会*/
            minPixelValue: 8, // (Number) 设置最小的转换数值，如果为1的话，只有大于1的值会被转换
            mediaQuery: false, // (Boolean) 媒体查询里的单位是否需要转换单位
            exclude: [/^node_modules$/,/Mobile/,/LoginPagePc\.vue$/],// (Array or Regexp) 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件
            // include: /\/src\/mobile\//,
            /*(Array or Regexp) 如果设置了include，那将只有匹配到的文件才会被转换，例如只转换 'src/mobile' 下的文件
            如果值是一个正则表达式，将包含匹配的文件，否则将排除该文件
            如果传入的值是一个数组，那么数组里的值必须为正则
            注意：exclude和include是可以一起设置的，将取两者规则的交集*/
            landscapeUnit: 'vw', //(String)横屏时使用的单位
            landscapeWidth: 3120 //(Number)横屏时使用的视口宽度
          }),
          pxtoviewport({
            // options
            unitToConvert: 'px',//(String) 需要转换的单位，默认为"px"
            viewportWidth: 1560, // (Number) 设计稿的视口宽度 pc 1600 pad/pc 1920 mobile 3120
            unitPrecision: 3, //  (Number) 单位转换后保留的精度（很多时候无法整除）
            viewportUnit: 'vw', // (String) 希望使用的视口单位
            selectorBlackList: ['.ignore', '.hairlines', 'LoginPage'],
            /*(Array) 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位
            如果传入的值为字符串的话，只要选择器中含有传入值就会被匹配
                例如 selectorBlackList 为 ['body'] 的话， 那么 .body-class 就会被忽略
            如果传入的值为正则表达式的话，那么就会依据CSS选择器是否匹配该正则
                例如 selectorBlackList 为 [/^body$/] , 那么 body 会被忽略，而 .body 不会*/
            minPixelValue: 8, // (Number) 设置最小的转换数值，如果为1的话，只有大于1的值会被转换
            mediaQuery: false, // (Boolean) 媒体查询里的单位是否需要转换单位
            exclude: [/^node_modules$/],// (Array or Regexp) 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件
            include: /Mobile/,
            /*(Array or Regexp) 如果设置了include，那将只有匹配到的文件才会被转换，例如只转换 'src/mobile' 下的文件
            如果值是一个正则表达式，将包含匹配的文件，否则将排除该文件
            如果传入的值是一个数组，那么数组里的值必须为正则
            注意：exclude和include是可以一起设置的，将取两者规则的交集*/
            landscapeUnit: 'vw', //(String)横屏时使用的单位
            landscapeWidth: 3120 //(Number)横屏时使用的视口宽度
          })
        ]
      }
    }
  }
};