Nested Public Modules

    projext-plugin-webpack-aurelia

    3.0.2 • Public • Published

    projext plugin for Aurelia on webpack

    Travis Coveralls github David David

    Allows you to bundle an Aurelia project with projext using the webpack build engine.

    Introduction

    projext allows you to configure a project without adding specific settings for a module bundler, then you can decide which build engine to use. This plugin is meant to be used when you are bundling an Aurelia application and you are using the webpack build engine.

    The plugin basically follows the instructions from the Aurelia webpack skeleton example, configures Aurelia entry point the Aurelia webpack plugin.

    It also adds a few extra functionalities:

    Information

    - -
    Package projext-plugin-webpack-aurelia
    Description Allows you to bundle an Aurelia project with projext using the webpack build engine.
    Node Version >= v10.13.0

    Usage

    You first need the build engine, so install projext-plugin-webpack.

    Now, if your target entry file imports aurelia-framework or aurelia-pal, projext will automatically set the target framework property to aurelia; otherwise you'll have to do it manually.

    Finally, on your target entry file:

    export const configure = (aurelia) => {
      ...
    }

    Done! Just configure your Aurelia plugins/components and run your target!

    Default HTML

    If you didn't create an HTML file for your Aurelia app, projext will automatically create one for you, and then this plugin will take care of updating it so you can run your app right away.

    There are some options you can change in your target settings in order to customize the way the HTML generated; you just need to add a frameworkOptions property on your target:

    {
      frameworkOptions: {
        title: null,
        useBody: true,
      }
    }
    • title: A custom title for the HTML file. By default, projext, uses the name of the target.
    • useBody: Whether to add the aurelia-app attribute and the directives on the <body /> or on a <div /> inside it.

    Development

    Yarn/NPM Tasks

    Task Description
    yarn test Run the project unit tests.
    yarn run lint Lint the modified files.
    yarn run lint:full Lint the project code.
    yarn run docs Generate the project documentation.

    Testing

    I use Jest with Jest-Ex to test the project. The configuration file is on ./.jestrc, the tests and mocks are on ./tests and the script that runs it is on ./utils/scripts/test.

    Linting

    I use ESlint to validate all our JS code. The configuration file for the project code is on ./.eslintrc and for the tests on ./tests/.eslintrc (which inherits from the one on the root), there's also an ./.eslintignore to ignore some files on the process, and the script that runs it is on ./utils/scripts/lint.

    Documentation

    I use ESDoc to generate HTML documentation for the project. The configuration file is on ./.esdocrc and the script that runs it is on ./utils/scripts/docs.

    Keywords

    none

    Install

    npm i projext-plugin-webpack-aurelia

    DownloadsWeekly Downloads

    35

    Version

    3.0.2

    License

    MIT

    Unpacked Size

    385 kB

    Total Files

    25

    Last publish

    Collaborators

    • homer0