vue.config.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. const { defineConfig } = require('@vue/cli-service')
  2. const path = require('path')
  3. const postcssPxToRem = require("postcss-pxtorem")
  4. // function resolve(dir) {
  5. // return path.join(__dirname, dir);
  6. // }
  7. module.exports = defineConfig({
  8. publicPath: './',
  9. transpileDependencies:true,
  10. lintOnSave:false,
  11. devServer: {
  12. host: '0.0.0.0',
  13. port: 8080,
  14. client: {
  15. webSocketURL: 'ws://0.0.0.0:8080/ws',
  16. },
  17. headers: {
  18. 'Access-Control-Allow-Origin': '*',
  19. }
  20. },
  21. chainWebpack: config => {
  22. //svg图标加载
  23. config.module
  24. .rule('svg')
  25. .exclude.add(path.join(__dirname, 'src/assets/icons/svg'))
  26. .end()
  27. config.module
  28. .rule('icons')
  29. .test(/\.svg$/)
  30. .include.add(path.join(__dirname, 'src/assets/icons'))
  31. .end()
  32. .use('svg-sprite-loader')
  33. .loader('svg-sprite-loader')
  34. .options({
  35. symbolId: 'icon-[name]'
  36. })
  37. .end()
  38. },
  39. css: {
  40. loaderOptions: {
  41. postcss: {
  42. postcssOptions: {
  43. plugins: [
  44. postcssPxToRem({
  45. rootValue: 16, // 基准值,根据设计稿调整
  46. propList: ['*'], // 需要转换的属性,这里设置为全部
  47. })
  48. ]
  49. }
  50. }
  51. }
  52. }
  53. })