search

systemjs / plugin-css

CSS loader plugin
MIT License
92 stars 60 forks source link

Bundle throws clean-css "Broken @import declaration" errors #43

Closed jannisg closed 9 years ago

jannisg commented 9 years ago

We have a standard bundle-sfx task running to get a production bundle out of our JSPM/SystemJS driven project which works great on Macs however seems to have started failing on Windows computers now.

Trying to track this down seems to point at the origin of the error coming from the clean-css module.

The breaking import statement in out app.js file is the standard: import 'styles.css!'; (also tried import './styles.css!'; to no avail)

The file is available at the desired/expected location (process runs fine on Mac) but the following error occurs on Windows computers/build servers:

err  Error: CSS Plugin:
     Broken @import declaration of "styles.css"
     Broken @import declaration of "jspm_packages\github\angular\bower-material@0.9.8\angular-material.css"
         at Loader.bundle (evalmachine.<anonymous>:48:11)
         at evalmachine.<anonymous>:83:22
         at tryCatchReject (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-load
er.src.js:1183:30)
         at runContinuation1 (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-lo
ader.src.js:1142:4)
         at Fulfilled.when (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-load
er.src.js:930:4)
         at Pending.run (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-loader.
src.js:821:13)
         at Scheduler._drain (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-lo
ader.src.js:97:19)
         at Scheduler.drain (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-loa
der.src.js:62:9)
         at process._tickCallback (node.js:419:13)
[09:56:14] 'bundle-shell-build' errored after 7.47 s
[09:56:14] Error in plugin 'gulp-shell'
Message:
    Command failed:
Details:
    killed: false
    code: 1
    signal: null
    stdout:      Building the single-file sfx bundle for app...

err  Error: CSS Plugin:
     Broken @import declaration of "styles.css"
     Broken @import declaration of "jspm_packages\github\angular\bower-material@0.9.8\angular-material.css"
         at Loader.bundle (evalmachine.<anonymous>:48:11)
         at evalmachine.<anonymous>:83:22
         at tryCatchReject (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-load
er.src.js:1183:30)
         at runContinuation1 (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-lo
ader.src.js:1142:4)
         at Fulfilled.when (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-load
er.src.js:930:4)
         at Pending.run (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-loader.
src.js:821:13)
         at Scheduler._drain (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-lo
ader.src.js:97:19)
         at Scheduler.drain (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\jspm\node_modules\systemjs\node_modules\es6-module-loader\dist\es6-module-loa
der.src.js:62:9)
         at process._tickCallback (node.js:419:13)

    stderr:
[09:56:14] 'bundle' errored after 32 s
[09:56:14] Error: [object Object]
    at formatError (C:\Program Files (x86)\nodejs\node_modules\gulp\bin\gulp.js:169:10)
    at Gulp.<anonymous> (C:\Program Files (x86)\nodejs\node_modules\gulp\bin\gulp.js:195:15)
    at Gulp.emit (events.js:117:20)
    at Gulp.Orchestrator._emitTaskDone (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\gulp\node_modules\orchestrator\index.js:264:8)
    at C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\gulp\node_modules\orchestrator\index.js:275:23
    at finish (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\gulp\node_modules\orchestrator\lib\runTask.js:21:8)
    at cb (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\gulp\node_modules\orchestrator\lib\runTask.js:29:3)
    at finish (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\run-sequence\index.js:53:5)
    at Gulp.onError (C:\ProjectsGit\Investigator-Blackbird-UI\node_modules\run-sequence\index.js:60:4)
    at Gulp.emit (events.js:117:20)

The project's package.json is below:

{
  "name": "Blackbird",
  "version": "0.4.0",
  "repository": {
    "url": "(private)"
  },
  "description": "",
  "main": "gulpfile.js",
  "directories": {
    "test": "test",
    "baseURL": "src",
    "lib": "src",
    "packages": "src/jspm_packages"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "postinstall": "jspm install",
    "start": "gulp watch"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-eslint": "^2.0.0",
    "browser-sync": "^2.2.1",
    "connect-modrewrite": "^0.7.11",
    "del": "^1.1.1",
    "eslint": "^0.16.2",
    "esprima": "^2.1.0",
    "gulp": "^3.8.11",
    "gulp-autoprefixer": "^2.2.0",
    "gulp-bump": "^0.3.0",
    "gulp-cached": "^1.0.2",
    "gulp-debug": "^2.0.1",
    "gulp-eslint": "^0.7.0",
    "gulp-file": "^0.2.0",
    "gulp-filter": "^2.0.2",
    "gulp-ftp": "^1.0.3",
    "gulp-inject": "^1.2.0",
    "gulp-load-plugins": "^0.8.1",
    "gulp-print": "^1.1.0",
    "gulp-protractor": "^1.0.0",
    "gulp-replace": "^0.5.3",
    "gulp-sass": "^1.3.3",
    "gulp-shell": "^0.3.0",
    "gulp-sourcemaps": "^1.5.0",
    "gulp-traceur": "^0.17.0",
    "gulp-util": "^3.0.4",
    "jasmine-screenshot-reporter": "0.0.6",
    "jasmine-spec-reporter": "^2.2.3",
    "jspm": "^0.15.6",
    "karma": "^0.12.31",
    "karma-chrome-launcher": "^0.1.7",
    "karma-clear-screen-reporter": "0.0.1",
    "karma-htmlfile-reporter": "^0.1.2",
    "karma-jasmine": "^0.3.5",
    "karma-jspm": "^1.1.4",
    "karma-logcapture-reporter": "0.0.1",
    "karma-nyan-reporter": "0.0.60",
    "karma-traceur-preprocessor": "^0.4.0",
    "protractor": "^2.0.0",
    "protractor-html-screenshot-reporter": "0.0.19",
    "protractor-jasmine2-screenshot-reporter": "^0.1.5",
    "rtts-assert": "angular/assert#dist",
    "run-sequence": "^1.0.2",
    "systemjs-builder": "^0.9.1",
    "through2": "^0.6.3",
    "traceur": "0.0.85",
    "yargs": "^3.7.0"
  },
  "jspm": {
    "directories": {
      "baseURL": "src",
      "lib": "src",
      "test": "test"
    },
    "configFile": "src/jspm.config.js",
    "dependencies": {
      "angular": "github:angular/bower-angular@^1.3.15",
      "angular-i18n": "github:angular/bower-angular-i18n@^1.4.0-rc",
      "angular-material": "github:angular/bower-material@^0.9.8",
      "angular-messages": "github:angular/bower-angular-messages@^1.4.0",
      "angular-mocks": "github:angular/bower-angular-mocks@^1.4.0",
      "angular-recursion": "github:marklagendijk/angular-recursion@^1.0.5",
      "angular-touch": "github:angular/bower-angular-touch@^1.4.0",
      "angular-ui-router": "github:angular-ui/ui-router@^0.2.13",
      "angular-ui-utils": "github:angular-ui/ui-utils@^0.2.3",
      "auth0/angular-jwt": "github:auth0/angular-jwt@^0.0.6",
      "auth0/angular-storage": "github:auth0/angular-storage@^0.0.9",
      "chenzhenxi/md-date-time": "github:chenzhenxi/md-date-time@^0.0.18",
      "chenzhenxi/moment-timezone": "github:chenzhenxi/moment-timezone@^0.3.3",
      "css": "github:systemjs/plugin-css@^0.1.6",
      "daviferreira/medium-editor": "github:yabwe/medium-editor@^4.12.1",
      "grevory/angular-local-storage": "github:grevory/angular-local-storage@^0.1.5",
      "lodash": "npm:lodash@^3.3.1",
      "moment": "github:moment/moment@^2.9.0",
      "text": "github:systemjs/plugin-text@^0.0.2",
      "through2": "npm:through2@^1.1.1"
    },
    "devDependencies": {
      "traceur": "github:jmcriffey/bower-traceur@0.0.88",
      "traceur-runtime": "github:jmcriffey/bower-traceur-runtime@0.0.88"
    }
  },
  "dependencies": {
    "gulp-rename": "^1.2.2"
  }
}
Klaster1 commented 9 years ago

I've got the same issue, looks like it's caused by e146559. Before: loader.baseURL.substr('file:'.length) After: address.replace(/^file:\/+/, '') Notice that regular expression has slash right after file:? Thanks to it, paths on Windows don't get file: removed, because they have a drive letter in it's place: file:D:/dev/asyst/development/app/asyst/style.css

jannisg commented 9 years ago

Fixed by the pull request https://github.com/systemjs/plugin-css/pull/44 of my colleague @robcleghorn.