Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/mobilexag/plugin-sass below:

dougludlow/plugin-sass: SystemJS SASS loader plugin

SystemJS SASS loader plugin. Can easily be installed with jspm package manager.

$ jspm install sass --dev

Recommended plugin usage configuration is:

SystemJS.config({
  meta: {
    "*.scss": { "loader": "sass" },
    "*.sass": { "loader": "sass" }
  }
});

To apply your SASS styles to your current page asynchronously:

System.import('./style.scss');

or synchronously

You can also use the older syntax , known as the indented syntax (or sometimes just "Sass")

System.import('./style.sass');

Note: if you use a different transpiler as Babel, like TypeScript, the plugin does not work by default. This is because this plugin and jspm / SystemJS is based on ES2015 syntax. All code is written with the Babel transpiler so you have to use the transpiler first before you can use the plugin. Please have a look at issue #25 for a solution.

• sass, scss
• @import supported
• "jspm:" prefix to refer jspm package files
• url rewrite and asset copier
• autoprefixer with custom configuration
• minified and non minified build
• bundle css separately or inline into build

You can import scss files from jspm packages from within scss files using the jspm: prefix. For example, if you have jspm installed twbs/bootstrap-sass:

@import 'jspm:bootstrap-sass/assets/stylesheets/bootstrap';

Some legacy plugin-css options are supported:

System.config({
  separateCSS: false, // change to true to separate css from js bundle
  buildCSS: true,     // change to false to not build css and process it manually
});

• separateCSS: true|false, default to false, set to true to separate css from js bundle, works well if plugin-css is not used, otherwise both plugins will try to save css in the same file and one will overwrite results of another one.
• buildCSS: true|false, defalt to true, set to to not build css and process it manually.

You can configure some options how the plugin should behave. Just add a new sassPluginOptions config object to your config.js.

System.config({
  sassPluginOptions: {
  }
})

To enable autoprefixer

sassPluginOptions: {
  "autoprefixer": true
}

or

sassPluginOptions: {
  "autoprefixer": {
    "browsers": ["last 2 versions"]
  }
}

To add SASS options

sassPluginOptions: {
  "sassOptions": {

  }
}

Options rewriteUrl enables rewrite scss URLs to use correct path from SystemJS base URL.

Option copyAssets enables copy CSS-related assets into destination folder.

jspm build app dist/app.js --format global --minify --skip-source-maps

sassPluginOptions: {
  "copyAssets": true,
  "rewriteUrl": true
}

$ npm install
...
$ jspm install

To run unit tests just do a

To test that everything works in your browser you can test runtime compilation

or bundling

or self-executing bundle

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4