Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SVG-related warnings during build #9934

Open
stargazer33 opened this issue Aug 30, 2024 · 0 comments
Open

SVG-related warnings during build #9934

stargazer33 opened this issue Aug 30, 2024 · 0 comments

Comments

@stargazer33
Copy link

stargazer33 commented Aug 30, 2024

🐛 bug report

When running npm run build I get this warning in stdout

You are trying to configure cleanupIDs which is not part of preset-default.
Try to put it before or after, for example

plugins: [
  {
    name: 'preset-default',
  },
  'cleanupIDs'
]

My HTML file contains multiple <svg> ... </svg>
I get this warning for each svg tag.

🎛 Configuration (.babelrc, package.json, cli command)

package.json:

{
  "version": "1.0.0",
  "private": true,

  "targets": {
    "ex": {
      "source": "ex.html"
    }
  },

  "scripts": {
    "build": "parcel build --target ex --no-cache"
  },

  "dependencies": {
    "@babel/runtime": "7.25.0",
    "@popperjs/core": "2.11.8",
    "bootstrap": "5.3.3",
    "sass": "1.77.6"
  },

  "devDependencies": {
    "parcel": "2.12.0"
  }
}

ex.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="container">
    <form id="search-form-id" class="position-relative">
        <div class="row">
            <div class="col-8 col-sm-8 col-12" >
                    <div class="input-group">
                        <input id="search-form-search-input-id"
                               name="q"
                               type="text"
                               class="form-control"
                        >
                        <span id="search-form-clear-search-id" class="position-absolute top-50 translate-middle-y d-none">
                        <svg xmlns="http://www.w3.org/2000/svg" style="cursor: pointer;" width="16" height="16" fill="currentColor" class="bi bi-x-circle" viewBox="0 0 16 16">
                            <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16"/>
                            <path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"/>
                        </svg>
                    </span>
                        <button id="search-form-search-button-id" class="btn btn-primary" type="submit">
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-search" viewBox="0 0 16 16">
                                <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0"/>
                            </svg>
                        </button>
                    </div>
            </div>
        </div>
    </form>
</div>
</body>
</html>

🤔 Expected Behavior

There should be no warnings

😯 Current Behavior

I get the warning (see above) for each tag.

🔦 Context

Usual web development

Please suggest a workaround:
Actually, I do not need SVG processing/optimization at all.
Having a workaround to turn off Parcel SVG processing for embedded SVG's would be good:
these SVG's coming from Bootstrap icons, so they could be just copied to dist/ "as is"

🌍 Your Environment

Software Version(s)
Parcel 2.12.0
Node v20.16.0
npm/Yarn npm 10.8.1
Operating System Ubuntu 22.04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant