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

Error importing bootstrap's minified file: property "url" must be followed by a ':' #431

Open
afialapis opened this issue Oct 8, 2022 · 0 comments

Comments

@afialapis
Copy link

Having this import in my code:

@import '~bootstrap/dist/css/bootstrap.min.css';

produces this error:

  Error: property "url" must be followed by a ':'
      at options.error (.../test-rollup-postcss-and-bootstrap/node_modules/node-sass/lib/index.js:290:33) {
    status: 1,
    file: '.../test-rollup-postcss-and-bootstrap/node_modules/bootstrap/dist/css/bootstrap.min.css',
    line: 6,
    column: 69384,
    formatted: `Error: property "url" must be followed by a ':'\n` +
      '        on line 6 of node_modules/bootstrap/dist/css/bootstrap.min.css\n' +
      '        from line 1 of src/style.scss\n' +
      '>> size:1.25rem;--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg x\n' +
      '   ------------------------------------------^\n',
    code: 'PLUGIN_ERROR',
    plugin: 'postcss',
    hook: 'transform',
    id: '.../test-rollup-postcss-and-bootstrap/src/style.scss',
    watchFiles: [
      '.../test-rollup-postcss-and-bootstrap/src/index.js',
      '.../test-rollup-postcss-and-bootstrap/src/style.scss'
    ]
  }

The error does not appear if we import he unminified file, like:

@import '~bootstrap/dist/css/bootstrap.css';

I have prepared the repo test-rollup-postcss-and-bootstrap to test this.

Running postcss (and node-sass) on their own does not seem to produce the problem.

This is the related css failing (of the unminified file, node_modules/bootstrap/dist/css/bootstrap.css):

.navbar {
...
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");

Error happens, at least, on this bootstrap versions:
· 5.1.3
· 5.2.2

Am I missing some param to rollup-plugin-postcss?

Thanks!

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