代码更新

surprise

2024-03-05 1ce1b525e7470ebaaeb0d5cd1e59bd905c1a7114

 vue.config.js

@@ -1,70 +1,68 @@
const path = require('path')

const resolve = dir => {
  return path.join(__dirname, dir)
}

// 项目部署基础
// 默认情况下，我们假设你的应用将被部署在域的根目录下,
// 例如：https://www.my-app.com/
// 默认：'/'
// 如果您的应用程序部署在子路径中，则需要在这指定子路径
// 例如：https://www.foobar.com/my-app/
// 需要将它改为'/my-app/'
const BASE_URL = process.env.NODE_ENV === 'production'
  ? './'
  : './'

/*
 * @Author: 王旭 1377869194@qq.com
 * @Date: 2023-05-08 13:52:20
 * @LastEditors: 王旭 1377869194@qq.com
 * @LastEditTime: 2023-05-08 14:17:30
 * @FilePath: \LFWEB_NEW\vue.config.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
const path = require("path")
const resolve = dir => path.join(__dirname, dir)
module.exports = {
  // Project deployment base
  // By default we assume your app will be deployed at the root of a domain,
  // e.g. https://www.my-app.com/
  // If your app is deployed at a sub-path, you will need to specify that
  // sub-path here. For example, if your app is deployed at
  // https://www.foobar.com/my-app/
  // then change this to '/my-app/'
  publicPath: BASE_URL,

  // tweak internal webpack configuration.
  // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
  chainWebpack: config => {
    config.resolve.alias
      .set('@', resolve('src'))
      .set('@c', resolve('src/components'))
      .set('@api', resolve('src/api'))
      .set('@config', resolve('src/config'))
      .set('@tools', resolve('src/components/tools'))
      .set('@mixin', resolve('src/components/mixin'))
      .set('@map', resolve('src/components/map'))
      .set('@assets', resolve('src/assets'))
  lintOnSave: false,
  publicPath: "./",
  devServer: {
    host: "0.0.0.0", //指定要使用的 host
    port: 12315, //指定端口号以侦听
    hotOnly: false, //启用热模块替换，而无需页面刷新作为构建失败时的回退。
  },

  configureWebpack: {
    resolve: {
      alias: {
        "@": resolve("src"),
      },
    },
  },
  css: {
    loaderOptions: {
      less: {
        javascriptEnabled: true
      }
    }
      postcss: {
        plugins: [
          require("postcss-px-to-viewport")({
            unitToConvert: "px", // 需要转换的单位
            viewportWidth: 1920, // 视口宽度，等同于设计稿宽度
            unitPrecision: 5, // 精确到小数点后几位
            /**
             * 将会被转换的css属性列表，
             * 设置为 * 表示全部，如：['*']
             * 在属性的前面或后面设置*，如：['*position*']，*position* 表示所有包含 position 的属性，如 background-position-y
             * 设置为 !xx 表示不匹配xx的那些属性，如：['!letter-spacing'] 表示除了letter-spacing 属性之外的其他属性
             * 还可以同时使用 ! 和 * ，如['!font*'] 表示除了font-size、 font-weight ...这些之外属性之外的其他属性名头部是‘font’的属性
             * */
            propList: ["*"],
            viewportUnit: "vw", // 需要转换成为的单位
            fontViewportUnit: "vw", // 需要转换称为的字体单位
            /**
             * 需要忽略的选择器，即这些选择器对应的属性值不做单位转换
             * 设置为字符串，转换器在做转换时会忽略那些选择器中包含该字符串的选择器，如：['body']会匹配到 .body-class，也就意味着.body-class对应的样式设置不会被转换
             * 设置为正则表达式，在做转换前会先校验选择器是否匹配该正则，如果匹配，则不进行转换，如[/^body$/]会匹配到 body 但是不会匹配到 .body
             */
            selectorBlackList: [],
            minPixelValue: 1, // 最小的像素单位值
            mediaQuery: false, // 是否转换媒体查询中设置的属性值
            replace: true, // 替换包含vw的规则，而不是添加回退
            /**
             * 忽略一些文件，如'node_modules'
             * 设置为正则表达式，将会忽略匹配该正则的所有文件
             * 如果设置为数组，那么该数组内的元素都必须是正则表达式
             */
            exclude: [],
            landscape: false, // 是否自动加入 @media (orientation: landscape)，其中的属性值是通过横屏宽度来转换的
            landscapeUnit: "vw", // 横屏单位
            landscapeWidth: 1334, // 横屏宽度
          }),
        ],
      },
    },
  },

  // 打包时不生成.map文件
  productionSourceMap: false,

  devServer: {
    open: true, // 自动打开浏览器
    // 这里写你调用接口的基础路径，来解决跨域，如果设置了代理，那你本地开发环境的axios的baseUrl要写为 '' ，即空字符串
    proxy: 'http://www.example.com/api',
    // Related: https://github.com/vuejs/vue-cli/issues/2051#issuecomment-449612956
    disableHostCheck: true
  },

  pluginOptions: {
    // 'style-resources-loader': {
    //   preProcessor: 'less',
    //   patterns: [
    //     path.resolve(__dirname, 'src/style/custom.less') // global custom less file.
    //   ]
    // }
  },
  lintOnSave: false
}