npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

generator-svalter

v1.2.0

Published

Generator to help you create and manage svelte/sapper application

Downloads

752

Readme

generator-svalter NPM version Build Status Dependency Status

Generator to help you create and manage svelte/sapper application

Features

  • Generate a boilerplate project for svelte, sapper or a component library
  • Generate routes (sapper only), components, models, services and (svelte) actions

Supported "templates"

  • Svelte : (javascript || typescript) && (css || scss)
  • Sapper : (javascript || typescript) && (css || scss)
  • Component library : (javascript || typescript) && (css || scss)

Installation

First, install Yeoman and generator-svalter using npm (we assume you have pre-installed node.js).

npm install -g yo
npm install -g generator-svalter

Usage notes :

Each option is optional. If the generator needs more data, you will be prompted a question.

Project generation

mkdir your-project
cd your-project
yo svalter [project_name] [options...]

svalter-gif

Available options

| Option | Description | | -----------------------------------: | ------------------------------------------------------------------------------------------------------------------------------------------------ | | --svelte | Creates a svelte project. (Skips the project type question) | | --sapper | Creates a sapper project. (Skips the project type question) | | --library | Creates a component library project (Skips the project type question) | | --css-reset=<name> | Adds a css reset in your project. name can be any of : none, meyer_reset, normalize, sanitize (Skips the css reset question) | | --style-separation | Components' styles will be put in a different file for each component | | --no-style-separation | Components' styles will be put in the same file as the markup | | --script-separation | Components' scripts will be put in a different file for each component | | --no-script-separation | Components' scripts will be put in the same file as the markup | | --typescript or --ts | Adds TypeScript support to your project | | --no-typescript or --no-ts | Does not add TypeScript support to your project | | --sass or --scss | Adds SASS support to your project | | --no-sass or --no-scss | Does not add SASS support to your project |

Component generation

#in a svalter project
yo svalter:component [component-name] [options...]

Available options

| Option | Description | | ------------------: | ---------------------------------------------------------------------------- | | --folder=path | Put the component in a specific folder (which will be under /src/components) |

Route generation

#in a svalter project
yo svalter:route [route] [options...]

If your route's name starts with [ and ends with ], you will be prompted to choose a predefined pattern to help you.
If you have existing routes containing path variables with patterns, you can skip the pattern, and the generator will still find the right route for you.
Example:
If a route "/a/[b(some-pattern)]/" exists, to generate a new [c] route, you can type :

yo svalter:route a/[b]/[c]

Available options

| Option | Description | | -----------------------------------: | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | --json-api or --api | Create a json api script in this generated route | | --page-component or --page | Create a page component in this generated route | | --page-layout or --layout | Create a page layout in this route | | --pattern=some_pattern | Available patterns: none, numbers, characters, uuid, date, time, datetime. Many patterns can be specified (separated by ; ) for each path variable that doesn't currently exist |

Service generation

#in a svalter project
yo svalter:service [service-name] [options...]

Available options

| Option | Description | | ------------------: | -------------------------------------------------------------------------------- | | --folder=path | Put the service in a specific folder (which will be under /src/scripts/services) |

Model generation

#in a svalter project
yo svalter:model [model-name] [options...]

Available options

| Option | Description | | ------------------: | ---------------------------------------------------------------------------- | | --folder=path | Put the model in a specific folder (which will be under /src/scripts/models) |

Action generation

#in a svalter project
yo svalter:action [action-name] [options...]

Available options

| Option | Description | | ------------------: | ------------------------------------------------------------------------------ | | --folder=path | Put the action in a specific folder (which will be under /src/scripts/actions) |

Considered features

Recipes generation
i18n addition

License

Apache-2.0 © Nokorbis