Skip to content

Commit

Permalink
Merge pull request #107 from oddbird/tilde-docs
Browse files Browse the repository at this point in the history 
[tilde-docs] Add docs on tilde imports
  • Loading branch information
@mirisuzanne
mirisuzanne committed Jun 2, 2017
2 parents 7e39f3e + ce84b7e commit 3f22624
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 1 deletion.
11 changes: 10 additions & 1 deletion .sassdoc/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>sass-true Documentation</title><link href="assets/img/favicon.ico" rel="shortcut icon"><link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700|Source+Sans+Pro:400,400i,700,700i" rel="stylesheet"><link rel="stylesheet" href="assets/css/main.css"><link rel="stylesheet" href="assets/css/theme.css"></head><body><svg xmlns="http://www.w3.org/2000/svg" hidden><symbol id="icon-menu" viewBox="0 0 24 28"><title>menu icon</title><path d="M24 21v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1V5c0-.547.453-1 1-1h22c.547 0 1 .453 1 1z"/></symbol><symbol id="icon-search" viewBox="0 0 24 28"><title>search icon</title><path d="M24 21v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1V5c0-.547.453-1 1-1h22c.547 0 1 .453 1 1z"/></symbol></svg><div data-sassdoc-region="app"><header role="banner" data-sassdoc-region="banner"><button data-nav-toggle="small" data-toggle="button" aria-controls="nav-small" aria-pressed="false" data-toggle-synced="false"><svg data-icon="menu" data-icon-size="icon-small"><title>menu</title><use xlink:href="#icon-menu"/></svg></button> <button data-nav-toggle="large" data-toggle="button" aria-controls="nav-large" aria-pressed="true" data-toggle-synced="false"><svg data-icon="menu" data-icon-size="icon-small"><title>menu</title><use xlink:href="#icon-menu"/></svg></button><h1 data-sassdoc="project-title"><a href="index.html" rel="home" data-sassdoc="project-name">sass-true</a> <span data-sassdoc="project-version">3.0.0-beta.1</span></h1></header><div data-sassdoc-region="container"><nav role="navigation" data-nav-menu="small" data-toggle="target" id="nav-small" data-target-id="nav-small" aria-expanded="false" data-auto-closing="false" data-auto-closing-on-any-click="false"><h3 data-sassdoc="nav-title"><a href="index.html" data-sassdoc-nav="is-active">sass-true</a></h3><li data-sassdoc="nav-item"><a href="api-assert-output.html" data-sassdoc-nav="is-not-active">Comparing Output</a></li><li data-sassdoc="nav-item"><a href="api-assert-values.html" data-sassdoc-nav="is-not-active">Comparing Values</a></li><li data-sassdoc="nav-item"><a href="api-test.html" data-sassdoc-nav="is-not-active">Describing Tests</a></li><li data-sassdoc="nav-item"><a href="api-xreport.html" data-sassdoc-nav="is-not-active">Reporting Results</a></li><li data-sassdoc="nav-item"><a href="private-assert.html" data-sassdoc-nav="is-not-active">_[assertion helpers]</a></li><li data-sassdoc="nav-item"><a href="private-context.html" data-sassdoc-nav="is-not-active">_[data helpers]</a></li><li data-sassdoc="nav-item"><a href="private-message.html" data-sassdoc-nav="is-not-active">_[reporting helpers]</a></li><li data-sassdoc="nav-item"><a href="private-test.html" data-sassdoc-nav="is-not-active">_[test helpers]</a></li><li data-sassdoc="nav-item"><a href="private-utils.html" data-sassdoc-nav="is-not-active">_[internal utilities]</a></li></nav><nav role="navigation" data-nav-menu="large" data-toggle="target" id="nav-large" data-target-id="nav-large" aria-expanded="true" data-auto-closing="false" data-auto-closing-on-any-click="false"><h3 data-sassdoc="nav-title"><a href="index.html" data-sassdoc-nav="is-active">sass-true</a></h3><li data-sassdoc="nav-item"><a href="api-assert-output.html" data-sassdoc-nav="is-not-active">Comparing Output</a></li><li data-sassdoc="nav-item"><a href="api-assert-values.html" data-sassdoc-nav="is-not-active">Comparing Values</a></li><li data-sassdoc="nav-item"><a href="api-test.html" data-sassdoc-nav="is-not-active">Describing Tests</a></li><li data-sassdoc="nav-item"><a href="api-xreport.html" data-sassdoc-nav="is-not-active">Reporting Results</a></li><li data-sassdoc="nav-item"><a href="private-assert.html" data-sassdoc-nav="is-not-active">_[assertion helpers]</a></li><li data-sassdoc="nav-item"><a href="private-context.html" data-sassdoc-nav="is-not-active">_[data helpers]</a></li><li data-sassdoc="nav-item"><a href="private-message.html" data-sassdoc-nav="is-not-active">_[reporting helpers]</a></li><li data-sassdoc="nav-item"><a href="private-test.html" data-sassdoc-nav="is-not-active">_[test helpers]</a></li><li data-sassdoc="nav-item"><a href="private-utils.html" data-sassdoc-nav="is-not-active">_[internal utilities]</a></li></nav><main role="main"><div data-sassdoc-region="main" data-sassdoc-page="index"><ul class="project-links"><li class="project-link-item" class="project-link-start"><a href="http://oddbird.net/true" class="project-link">View Project</a></li><li class="project-link-item"><a href="http://github.com/oddbird/true.git" class="project-link">View Source</a></li></ul><h1 id="true">True</h1><p><a href="https://travis-ci.org/oddbird/true"><img src="https://api.travis-ci.org/oddbird/true.svg" alt="Build Status"></a></p><p><a href="https://opensource.org/licenses/BSD-3-Clause"><img src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" alt="License"></a></p><p><a href="https://greenkeeper.io/"><img src="https://badges.greenkeeper.io/oddbird/true.svg" alt="Greenkeeper badge"></a></p><p>True is a unit-testing tool for <a href="http://sass-lang.com">Sass</a> code – initially developed for the <a href="http://susy.oddbird.net">Susy layout toolkit</a>. All of the test code is written in pure Sass, and can be compiled by any Sass compiler – but we also provide integration with <a href="https://mochajs.org/">Mocha JS</a>, for extra features and improved reporting.</p><p><strong>Verb</strong></p><ol><li><p>To make true; shape, adjust, place, etc., exactly or accurately:</p><p><em>True the wheels of a bicycle after striking a pothole.</em></p></li><li><p>To make even, symmetrical, level, etc. (often followed by <em>up</em>):</p><p><em>True up the sides of a door.</em></p></li><li><p>To test your Sass code; debug, perfect, etc. (often using <em>True</em>):</p><p><em>True your sweet plugin before you deploy.</em></p></li></ol><h2 id="install">Install</h2><p>In command line:</p><pre><code class="lang-bash"># npm module
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>sass-true Documentation</title><link href="assets/img/favicon.ico" rel="shortcut icon"><link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700|Source+Sans+Pro:400,400i,700,700i" rel="stylesheet"><link rel="stylesheet" href="assets/css/main.css"><link rel="stylesheet" href="assets/css/theme.css"></head><body><svg xmlns="http://www.w3.org/2000/svg" hidden><symbol id="icon-menu" viewBox="0 0 24 28"><title>menu icon</title><path d="M24 21v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1V5c0-.547.453-1 1-1h22c.547 0 1 .453 1 1z"/></symbol><symbol id="icon-search" viewBox="0 0 24 28"><title>search icon</title><path d="M24 21v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1v-2c0-.547.453-1 1-1h22c.547 0 1 .453 1 1zm0-8v2c0 .547-.453 1-1 1H1c-.547 0-1-.453-1-1V5c0-.547.453-1 1-1h22c.547 0 1 .453 1 1z"/></symbol></svg><div data-sassdoc-region="app"><header role="banner" data-sassdoc-region="banner"><button data-nav-toggle="small" data-toggle="button" aria-controls="nav-small" aria-pressed="false" data-toggle-synced="false"><svg data-icon="menu" data-icon-size="icon-small"><title>menu</title><use xlink:href="#icon-menu"/></svg></button> <button data-nav-toggle="large" data-toggle="button" aria-controls="nav-large" aria-pressed="true" data-toggle-synced="false"><svg data-icon="menu" data-icon-size="icon-small"><title>menu</title><use xlink:href="#icon-menu"/></svg></button><h1 data-sassdoc="project-title"><a href="index.html" rel="home" data-sassdoc="project-name">sass-true</a> <span data-sassdoc="project-version">3.0.0-beta.1</span></h1></header><div data-sassdoc-region="container"><nav role="navigation" data-nav-menu="small" data-toggle="target" id="nav-small" data-target-id="nav-small" aria-expanded="false" data-auto-closing="false" data-auto-closing-on-any-click="false"><h3 data-sassdoc="nav-title"><a href="index.html" data-sassdoc-nav="is-active">sass-true</a></h3><li data-sassdoc="nav-item"><a href="api-assert-output.html" data-sassdoc-nav="is-not-active">Comparing Output</a></li><li data-sassdoc="nav-item"><a href="api-assert-values.html" data-sassdoc-nav="is-not-active">Comparing Values</a></li><li data-sassdoc="nav-item"><a href="api-test.html" data-sassdoc-nav="is-not-active">Describing Tests</a></li><li data-sassdoc="nav-item"><a href="api-xreport.html" data-sassdoc-nav="is-not-active">Reporting Results</a></li><li data-sassdoc="nav-item"><a href="private-assert.html" data-sassdoc-nav="is-not-active">_[assertion helpers]</a></li><li data-sassdoc="nav-item"><a href="private-context.html" data-sassdoc-nav="is-not-active">_[data helpers]</a></li><li data-sassdoc="nav-item"><a href="private-message.html" data-sassdoc-nav="is-not-active">_[reporting helpers]</a></li><li data-sassdoc="nav-item"><a href="private-test.html" data-sassdoc-nav="is-not-active">_[test helpers]</a></li><li data-sassdoc="nav-item"><a href="private-utils.html" data-sassdoc-nav="is-not-active">_[internal utilities]</a></li></nav><nav role="navigation" data-nav-menu="large" data-toggle="target" id="nav-large" data-target-id="nav-large" aria-expanded="true" data-auto-closing="false" data-auto-closing-on-any-click="false"><h3 data-sassdoc="nav-title"><a href="index.html" data-sassdoc-nav="is-active">sass-true</a></h3><li data-sassdoc="nav-item"><a href="api-assert-output.html" data-sassdoc-nav="is-not-active">Comparing Output</a></li><li data-sassdoc="nav-item"><a href="api-assert-values.html" data-sassdoc-nav="is-not-active">Comparing Values</a></li><li data-sassdoc="nav-item"><a href="api-test.html" data-sassdoc-nav="is-not-active">Describing Tests</a></li><li data-sassdoc="nav-item"><a href="api-xreport.html" data-sassdoc-nav="is-not-active">Reporting Results</a></li><li data-sassdoc="nav-item"><a href="private-assert.html" data-sassdoc-nav="is-not-active">_[assertion helpers]</a></li><li data-sassdoc="nav-item"><a href="private-context.html" data-sassdoc-nav="is-not-active">_[data helpers]</a></li><li data-sassdoc="nav-item"><a href="private-message.html" data-sassdoc-nav="is-not-active">_[reporting helpers]</a></li><li data-sassdoc="nav-item"><a href="private-test.html" data-sassdoc-nav="is-not-active">_[test helpers]</a></li><li data-sassdoc="nav-item"><a href="private-utils.html" data-sassdoc-nav="is-not-active">_[internal utilities]</a></li></nav><main role="main"><div data-sassdoc-region="main" data-sassdoc-page="index"><ul class="project-links"><li class="project-link-item" class="project-link-start"><a href="http://oddbird.net/true" class="project-link">View Project</a></li><li class="project-link-item"><a href="http://github.com/oddbird/true.git" class="project-link">View Source</a></li></ul><h1 id="true">True</h1><p><a href="https://travis-ci.org/oddbird/true"><img src="https://api.travis-ci.org/oddbird/true.svg" alt="Build Status"></a></p><p><a href="https://opensource.org/licenses/BSD-3-Clause"><img src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" alt="License"></a></p><p>True is a unit-testing tool for <a href="http://sass-lang.com">Sass</a> code – initially developed for the <a href="http://susy.oddbird.net">Susy layout toolkit</a>. All of the test code is written in pure Sass, and can be compiled by any Sass compiler – but we also provide integration with <a href="https://mochajs.org/">Mocha JS</a>, for extra features and improved reporting.</p><p><strong>Verb</strong></p><ol><li><p>To make true; shape, adjust, place, etc., exactly or accurately:</p><p><em>True the wheels of a bicycle after striking a pothole.</em></p></li><li><p>To make even, symmetrical, level, etc. (often followed by <em>up</em>):</p><p><em>True up the sides of a door.</em></p></li><li><p>To test your Sass code; debug, perfect, etc. (often using <em>True</em>):</p><p><em>True your sweet plugin before you deploy.</em></p></li></ol><h2 id="install">Install</h2><p>In command line:</p><pre><code class="lang-bash"># npm module
npm install sass-true
</code></pre><p>Import in your test directory, like any other Sass file:</p><pre><code class="lang-scss">@import &quot;true&quot;;
</code></pre><p>Depending on your setup, you may need to include the full path name:</p><pre><code class="lang-scss">// This is only an example
Expand Down Expand Up @@ -47,4 +47,13 @@
all: [&#39;test/test_sass.js&#39;]
},
</code></pre><p>Run tests:</p><pre><code class="lang-bash">grunt mochacli
</code></pre><h3 id="imports-without-webpack">Imports without Webpack</h3><p>If you use Webpack&#39;s tilde notation, like <code>@import &#39;~accoutrement-init/sass/init&#39;</code>, you&#39;ll need to tell <code>runSass</code> how to handle that. That will require writing a custom importer and passing it into the configuration for <code>runSass</code>. Something like:</p><pre><code class="lang-js">function importer(url, prev, done) {
if (url[0] === &#39;~&#39;) {
url = path.resolve(&#39;node_modules&#39;, url.substr(1));
}

return { file: url };
}

sassTrue.runSass({ importer, file: sassFile }, describe, it);
</code></pre></div></main></div></div><script type="text/javascript" src="assets/js/jquery-3.1.1.slim.js"></script><script type="text/javascript" src="assets/js/highlight.js"></script><script type="text/javascript" src="assets/js/base.js"></script><script type="text/javascript" src="assets/js/init.js"></script></body></html>
19 changes: 19 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -211,3 +211,22 @@ Run tests:
```bash
grunt mochacli
```
### Imports without Webpack
If you use Webpack's tilde notation, like `@import
'~accoutrement-init/sass/init'`, you'll need to tell `runSass` how to handle
that. That will require writing a custom importer and passing it into the
configuration for `runSass`. Something like:
```js
function importer(url, prev, done) {
if (url[0] === '~') {
url = path.resolve('node_modules', url.substr(1));
}
return { file: url };
}
sassTrue.runSass({ importer, file: sassFile }, describe, it);
```

0 comments on commit 3f22624

Please sign in to comment.