Skip to content

Commit

Permalink
feat: restructure
Browse files Browse the repository at this point in the history
  • Loading branch information
@lucagoslar
lucagoslar committed Nov 10, 2022
1 parent 4e4f0c5 commit 410ff02
Show file tree
Hide file tree
Showing 10 changed files with 3,328 additions and 9,948 deletions.
66 changes: 39 additions & 27 deletions .github/workflows/main.yml
View file
Original file line number Diff line number Diff line change
@@ -1,42 +1,54 @@
# This workflow will do a clean install of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions

name: build package and run tests

on:
push:
branches: [main]
paths:
- 'package.json'
- 'tsconfig.json'
- 'tsconfig.build.json'
- 'src/**'
- '.github/workflows/main.yml'
- 'src/**'
- 'package.json'
- 'tsconfig.*'
pull_request:
branches: [main]

jobs:
test:
name: main
build-and-run-tests:
runs-on: ubuntu-latest

strategy:
matrix:
node-version: [16.x]
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v2
- name: Checkout
uses: actions/checkout@v3

- name: Install Node.js
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node-version }}
cache: 'npm'
- name: Install
run: npm install
- name: Test
run: npm run test
- name: Build
run: npm run build
- name: Publish (npm dry run)
run: npm pack --dry-run
node-version: 18

- uses: pnpm/action-setup@v2.0.1
name: Install pnpm
id: pnpm-install
with:
version: 7.5.0
run_install: false

- name: Get pnpm store directory
id: pnpm-cache
run: |
echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
- uses: actions/cache@v3
name: Setup pnpm cache
with:
path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-pnpm-store-
- name: Install dependencies
run: pnpm install

- name: Test package
run: pnpm run test

- name: Build package
run: pnpm run build
34 changes: 21 additions & 13 deletions .github/workflows/publish.yml
View file
Original file line number Diff line number Diff line change
@@ -1,27 +1,35 @@
# https://github.com/marketplace/actions/npm-publish
name: publish
name: publish package

on:
release:
types: [published]

jobs:
build:
publish:
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v2
- name: Checkout
uses: actions/checkout@v3

- name: Install Node.js
uses: actions/setup-node@v3
with:
node-version: 18

- uses: pnpm/action-setup@v2.0.1
with:
node-version: 16
registry-url: https://registry.npmjs.org/
version: 7.5.0

- run: npm ci
- name: Install dependencies
run: pnpm install --frozen-lockfile

- run: npm run build
- name: Build package
run: pnpm run build

# - run: npm pack --dry-run
- name: Publish package
# run: pnpm publish --dry-run
run: pnpm publish --access public

- run: npm publish --access public
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
2 changes: 2 additions & 0 deletions .npmrc
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
git-checks=false
publish-branch=main
96 changes: 7 additions & 89 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,101 +1,21 @@
## svelte-preprocess-sass-alias-import
## ts-pkg

🗃 Import external stylesheets with the help of absolute paths.
This is a Boilerplate to create npm packages in TypeScript.

Though this package might also work in a different environment that uses sass, it should be noted that it serves the [legacy importer](https://sass-lang.com/documentation/js-api/modules#LegacyImporter) used by [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess).
[![build package and run tests](https://github.com/lucagoslar/ts-pkg/actions/workflows/main.yml/badge.svg)](https://github.com/lucagoslar/ts-pkg/actions/workflows/main.yml)

[![build and test](https://github.com/lucagoslar/svelte-preprocess-sass-alias-import/actions/workflows/main.yml/badge.svg)](https://github.com/lucagoslar/svelte-preprocess-sass-alias-import/actions/workflows/main.yml)

## Setup

1. Import `SassAlias` from `svelte-preprocess-sass-alias-import`.

```ts
import { SassAlias } from 'svelte-preprocess-sass-alias-import';
```

2. Instantiate `SassAlias` and pass it an object containing your rules.

```ts
const alias = new SassAlias({
$var: 'src/scss',
@var: ["src", "scss"]
});
```

3. Add and bind the `SassAlias` instance to the project's preprocessor.
(Sample usage with SvelteKit.)

```ts
// svelte.config.js
import preprocess from 'svelte-preprocess';

/** @type {import('@sveltejs/kit').Config} */
const config = {
preprocess: [
preprocess({
sass: {
importer: [alias.resolve.bind(alias)],
},
scss: {
importer: [alias.resolve.bind(alias)],
}, // Use for both sass and or scss
}),
],

kit: {
vite: {
// Only required if you want to import stylesheets into an already imported stylesheet
css: {
preprocessorOptions: {
sass: {
importer: [alias.resolve.bind(alias)],
},
scss: {
importer: [alias.resolve.bind(alias)],
},
},
},
},
},
};

export default config;
```

4. Import files using your predefined aliases.

```svelte
<!-- *.svelte -->
<style lang="scss">
@import "$var/main.scss";
</style>
```

```svelte
<!-- *.svelte -->
<style lang="sass">
@use "@var/main.scss"
</style>
```

```scss
// *.scss
@use '@var/main.scss';
```

## Contribute
## Usage

Install all (dev-)dependencies by running the following.

```
npm i
pnpm i
```

Make sure [husky](https://github.com/typicode/husky) is being installed too.

```
npm run prepare
pnpm run prepare
```

\
Expand All @@ -104,7 +24,5 @@ _And off we go …_
Build this project with the following.

```
npm run build
pnpm run build
```

Contributions of any kind are very much appreciated.
Loading

0 comments on commit 410ff02

Please sign in to comment.