title: How can you prevent resolving absolute paths in css preprocessing when using vue3 cli?
body: <p>I am migrating our vue app to Vue 3. The new documentation says absolute paths are left alone, and that public/static images are copied over, which is what we leverage now to serve commonly used assets (we have many so I'm not interested in refactoring these at the moment).</p>
  <p>As part of the migration, I am hoping to add global less variables so I don't have to import our variables every time I want to do anything. It was recommended that I use <a href="https://github.com/nguyenvanduocit/vue-cli-plugin-style-resources-loader" rel="nofollow noreferrer">https://github.com/nguyenvanduocit/vue-cli-plugin-style-resources-loader</a>. I followed the steps:</p>
  <ol>
  <li><p>Install the library
  <code>vue add style-resources-loader</code></p>
  </li>
  <li><p>Update our vue config:</p>
  </li>
  </ol>
  <pre><code>const { defineConfig } = require('@vue/cli-service')
  module.exports = defineConfig({
    ...
    pluginOptions: {
      'style-resources-loader': {
        preProcessor: 'less',
        patterns: [
          resolve('src/assets/styles/transitions.less'),
          resolve('src/assets/styles/variables.less'),
        ]
      }
    },
  </code></pre>
  <p>But now when I start up the server, I get a myriad of errors:</p>
  <pre><code>ERROR in ./src/pages/setup/index.less?vue&amp;type=style&amp;index=0&amp;lang=less (./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/style-resources-loader/lib/index.js??clonedRuleSet-32.use[4]!./src/pages/setup/index.less?vue&amp;type=style&amp;index=0&amp;lang=less) 5:36-90
  Module not found: Error: Can't resolve '/static/img/logos/logo.svg'...
  </code></pre>
  <p>This particular error is in reference to an import in the less file:</p>
  <pre><code>.navlink-logo--white {
    background: url(/static/img/logos/logo.svg) 50% no-repeat;
  }
  </code></pre>
  <p>It appears the preprocessor is trying to resolve absolute paths? How do I prevent this?</p>