@appnest/web-config
A Rollup configuration to help you build modern web applications.
Last updated 5 days ago by explore .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @appnest/web-config 
SYNC missed versions from official npm registry.

@appnest/web-config

Downloads per month NPM Version Dependencies Contributors

A Rollup configuration to help you build modern web applications.
The configuration works extremely well with the libraries lit-html and lit-element. I wanted to share it so you can use it too or build on top of it.


-----------------------------------------------------

➤ Table of Contents

-----------------------------------------------------

➤ Step 1 - Installation

The fastest way to get started is to use the CLI. Run the following command to setup your project from scratch. If you choose to use the CLI you can skip the rest of the steps in this README file.

$ npm init web-config new <dir>

To use it in your project you can install it like this.

$ npm i @appnest/web-config --D

-----------------------------------------------------

➤ Step 2 - Setup rollup.config.ts

Here's an example on what your Rollup configuration file could look like:

import {resolve, join} from "path";
import pkg from "./package.json";
import {
  defaultExternals,
  defaultOutputConfig,
  defaultPlugins,
  defaultProdPlugins,
  defaultServePlugins,
  isLibrary,
  isProd,
  isServe
} from "@appnest/web-config";

const folders = {
  dist: resolve(__dirname, "dist"),
  src: resolve(__dirname, "src/demo"),
  src_assets: resolve(__dirname, "src/demo/assets"),
  dist_assets: resolve(__dirname, "dist/assets")
};

const files = {
  main: join(folders.src, "main.ts"),
  src_index: join(folders.src, "index.html"),
  dist_index: join(folders.dist, "index.html")
};

export default {
  input: {
    main: files.main
  },
  output: [
    defaultOutputConfig({
      dir: folders.dist,
      format: "esm"
    })
  ],
  plugins: [
    ...defaultPlugins({
      copyConfig: {
        resources: [[folders.src_assets, folders.dist_assets]],
      },
      cleanerConfig: {
        targets: [
          folders.dist
        ]
      },
      htmlTemplateConfig: {
        template: files.src_index,
        target: files.dist_index,
        include: /main(-.*)?\.js$/
      },
      importStylesConfig: {
        globals: ["main.scss"]
      }
    }),

    // Serve
    ...(isServe ? [
        ...defaultServePlugins({
            dist: folders.dist
        })
    ] : []),

    // Production
    ...(isProd ? [
        ...defaultProdPlugins({
            dist: folders.dist
        })
    ] : [])
  ],
  treeshake: isProd,
  context: "window"
}

-----------------------------------------------------

➤ Step 3 - Setup tslint.json

{
  "extends": "./node_modules/@appnest/web-config/tslint.json"
}

-----------------------------------------------------

➤ Step 4 - Setup tsconfig.json

{
  "extends": "./node_modules/@appnest/web-config/tsconfig.json"
}

-----------------------------------------------------

➤ Step 5 - Setup .browserslistrc

The tools transpiling your code are using browserslist to figure out what is supported. Your .browserslistrc could look like this.

last 2 Chrome versions
last 2 Safari versions
last 2 Firefox versions

-----------------------------------------------------

➤ Step 6 - Setup karma.conf.js

const {defaultResolvePlugins, defaultKarmaConfig} = require("@appnest/web-config");

module.exports = (config) => {
  config.set({
    ...defaultKarmaConfig({
      rollupPlugins: defaultResolvePlugins()
    }),
    basePath: "src",
    logLevel: config.LOG_INFO
  });
};

-----------------------------------------------------

➤ Step 7 - Add start and build scripts to package.json

Here an example on what scripts you could add to your package.json file.

{
  ...
  scripts: {
    "b:dev": "rollup -c --environment NODE_ENV:dev",
    "b:prod": "rollup -c --environment NODE_ENV:prod",
    "s:dev": "rollup -c --watch --environment NODE_ENV:dev",
    "s:prod": "rollup -c --watch --environment NODE_ENV:prod",
    "s": "npm run s:dev"
    ...
  }
  ...
}

-----------------------------------------------------

➤ How to load stylesheets

Add the following to your typings.d.ts file!

This is to make Typescript not complaining about SCSS, CSS and JSON imports.

/// <reference path="node_modules/@appnest/web-config/typings.d.ts" />

Load a global stylesheet (it will be added to the template file)

Step 1: Import your stylesheet using the ES6 import syntax

import "./main.scss";

Step 2: Include the name of the stylesheet in your Rollup config

export default {
  ...
    defaultPlugins({
       ...
       importStylesConfig: {
         globals: ["main.scss"]
       },
       ...
    }),
  ...
}

Load a stylesheet as a string

import css from "./my-component.scss";

-----------------------------------------------------

➤ Contributors

Andreas Mehlsen You?
Andreas Mehlsen You?

-----------------------------------------------------

➤ License

Licensed under MIT.

Current Tags

  • 0.4.28                                ...           latest (5 days ago)

141 Versions

  • 0.4.28                                ...           5 days ago
  • 0.4.27                                ...           a month ago
  • 0.4.26                                ...           a month ago
  • 0.4.25                                ...           3 months ago
  • 0.4.24                                ...           5 months ago
  • 0.4.23                                ...           5 months ago
  • 0.4.22                                ...           5 months ago
  • 0.4.21                                ...           5 months ago
  • 0.4.20                                ...           6 months ago
  • 0.4.19                                ...           6 months ago
  • 0.4.18                                ...           6 months ago
  • 0.4.17                                ...           6 months ago
  • 0.4.16                                ...           6 months ago
  • 0.4.15                                ...           6 months ago
  • 0.4.14                                ...           6 months ago
  • 0.4.13                                ...           6 months ago
  • 0.4.12                                ...           7 months ago
  • 0.4.11                                ...           7 months ago
  • 0.4.10                                ...           7 months ago
  • 0.4.9                                ...           7 months ago
  • 0.4.8                                ...           7 months ago
  • 0.4.7                                ...           7 months ago
  • 0.4.6                                ...           7 months ago
  • 0.4.5                                ...           7 months ago
  • 0.4.4                                ...           7 months ago
  • 0.4.3                                ...           7 months ago
  • 0.4.2                                ...           7 months ago
  • 0.4.1                                ...           7 months ago
  • 0.4.0                                ...           7 months ago
  • 0.3.39                                ...           7 months ago
  • 0.3.38                                ...           7 months ago
  • 0.3.37                                ...           7 months ago
  • 0.3.36                                ...           7 months ago
  • 0.3.35                                ...           7 months ago
  • 0.3.34                                ...           7 months ago
  • 0.3.33                                ...           7 months ago
  • 0.3.32                                ...           7 months ago
  • 0.3.31                                ...           7 months ago
  • 0.3.30                                ...           7 months ago
  • 0.3.29                                ...           7 months ago
  • 0.3.28                                ...           7 months ago
  • 0.3.27                                ...           7 months ago
  • 0.3.26                                ...           8 months ago
  • 0.3.25                                ...           8 months ago
  • 0.3.24                                ...           8 months ago
  • 0.3.23                                ...           8 months ago
  • 0.3.21                                ...           8 months ago
  • 0.3.20                                ...           8 months ago
  • 0.3.19                                ...           8 months ago
  • 0.3.18                                ...           8 months ago
  • 0.3.17                                ...           8 months ago
  • 0.3.16                                ...           8 months ago
  • 0.3.15                                ...           8 months ago
  • 0.3.14                                ...           8 months ago
  • 0.3.13                                ...           8 months ago
  • 0.3.12                                ...           8 months ago
  • 0.3.11                                ...           8 months ago
  • 0.3.10                                ...           8 months ago
  • 0.3.9                                ...           8 months ago
  • 0.3.8                                ...           8 months ago
  • 0.3.7                                ...           8 months ago
  • 0.3.6                                ...           8 months ago
  • 0.3.5                                ...           8 months ago
  • 0.3.4                                ...           8 months ago
  • 0.3.3                                ...           8 months ago
  • 0.3.2                                ...           8 months ago
  • 0.3.1                                ...           8 months ago
  • 0.3.0                                ...           9 months ago
  • 0.2.6                                ...           9 months ago
  • 0.2.5                                ...           9 months ago
  • 0.2.4                                ...           9 months ago
  • 0.2.3                                ...           9 months ago
  • 0.2.2                                ...           9 months ago
  • 0.2.1                                ...           9 months ago
  • 0.2.0                                ...           9 months ago
  • 0.1.35                                ...           a year ago
  • 0.1.34                                ...           a year ago
  • 0.1.33                                ...           a year ago
  • 0.1.32                                ...           a year ago
  • 0.1.31                                ...           a year ago
  • 0.1.30                                ...           a year ago
  • 0.1.29                                ...           a year ago
  • 0.1.28                                ...           a year ago
  • 0.1.27                                ...           a year ago
  • 0.1.26                                ...           a year ago
  • 0.1.25                                ...           a year ago
  • 0.1.24                                ...           a year ago
  • 0.1.23                                ...           a year ago
  • 0.1.22                                ...           a year ago
  • 0.1.21                                ...           a year ago
  • 0.1.20                                ...           a year ago
  • 0.1.19                                ...           a year ago
  • 0.1.18                                ...           a year ago
  • 0.1.17                                ...           a year ago
  • 0.1.16                                ...           a year ago
  • 0.1.15                                ...           a year ago
  • 0.1.14                                ...           a year ago
  • 0.1.13                                ...           a year ago
  • 0.1.12                                ...           a year ago
  • 0.1.11                                ...           a year ago
  • 0.1.10                                ...           a year ago
  • 0.1.9                                ...           a year ago
  • 0.1.7                                ...           a year ago
  • 0.1.6                                ...           a year ago
  • 0.1.5                                ...           a year ago
  • 0.1.4                                ...           a year ago
  • 0.1.3                                ...           a year ago
  • 0.1.2                                ...           a year ago
  • 0.1.1                                ...           a year ago
  • 0.1.0                                ...           a year ago
  • 0.0.36                                ...           a year ago
  • 0.0.35                                ...           a year ago
  • 0.0.34                                ...           a year ago
  • 0.0.32                                ...           a year ago
  • 0.0.31                                ...           a year ago
  • 0.0.30                                ...           a year ago
  • 0.0.29                                ...           a year ago
  • 0.0.28                                ...           a year ago
  • 0.0.27                                ...           a year ago
  • 0.0.26                                ...           a year ago
  • 0.0.25                                ...           a year ago
  • 0.0.24                                ...           a year ago
  • 0.0.23                                ...           a year ago
  • 0.0.22                                ...           a year ago
  • 0.0.21                                ...           a year ago
  • 0.0.20                                ...           a year ago
  • 0.0.19                                ...           a year ago
  • 0.0.18                                ...           a year ago
  • 0.0.17                                ...           a year ago
  • 0.0.16                                ...           a year ago
  • 0.0.15                                ...           a year ago
  • 0.0.14                                ...           a year ago
  • 0.0.13                                ...           a year ago
  • 0.0.12                                ...           a year ago
  • 0.0.11                                ...           2 years ago
  • 0.0.10                                ...           2 years ago
  • 0.0.9                                ...           2 years ago
  • 0.0.8                                ...           2 years ago
  • 0.0.7                                ...           2 years ago
  • 0.0.6                                ...           2 years ago
  • 0.0.5                                ...           2 years ago
Maintainers (2)
Downloads
Today 0
This Week 143
This Month 166
Last Day 0
Last Week 22
Last Month 194
Dependencies (47)
Dev Dependencies (11)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |