Skip to content

css loaders fail to parse relative paths #730

Closed

Description

@doronnac

Note: for support questions, please use one of these channels: Chat: AngularClass.slack or Twitter: @AngularClass

  • I'm submitting a ...
    [x ] bug report
    [ ] feature request
    [ ] question about the decisions made in the repository
  • Do you want to request a feature or report a bug?
    Report a bug
  • What is the current behavior?
    requiring css in the styles Component attribute fails to concatenate base url to a relative url within that css file, instead concatenating './' and interrupting build process if the file isn't found.
  • If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via
    https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).

Current project, Commit a4019da :

home.component.ts 24:3, change to:
styles: [ require('./home.style.css') ],

home.style.css, add:
:host {
background: url('assets/img/angular-logo.png');
}

run npm run start:hmr

  • What is the expected behavior?
  • base url should be concatenated to the relative url.
  • build process should not be interrupted if the url isn't found
  • What is the motivation / use case for changing the behavior?
    This behavior is not expected to break when all past versions of this repo supported it, and Angular's docs encourage it in the Webpack section.
  • Please tell us about your environment:
  • Angular version: 2.0.0-beta.rc.3
  • Browser: [all ]
  • Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

Switching back to raw-loader to handle css files solves this issue.

Activity

  1. Settler commented on Jun 30, 2016

    @Settler

    You can use https://github.com/smithad15/css-to-string-loader
    { test: /\.css$/, loader: 'css-to-string-loader!css-loader' }

    css-loader will take care about url() in css, and css-to-string-loader will return all back to string.

  2. maissani commented on Jul 6, 2016

    @maissani

    Sames issue as #759
    I confirm that Urls in backgrounds urls doesn't works.

  3. bergkampho commented on Jul 29, 2016

    @bergkampho

    I tried @Settler solution to use css-to-string-loader. It works!

  4. christofferjjohansen commented on Nov 18, 2016

    @christofferjjohansen

    ^^ same, tried @Settler method. Worked

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions