generator-confit/lib/buildTool/webpack/webpackResources.yml

Yeoman generator for creating the development process, tools and a sample project for current-generation web applications

buildBrowser:
  packages:
    - <<: *pkg_webpack
    - <<: *pkg_webpack-dev-server
    - <<: *pkg_extract-text-webpack-plugin

  tasks:
    - name: build:dev
      tasks: ['webpack-dev-server --progress --config <%= paths.config.configDir %>webpack/dev.webpack.config.js --hot']
      description: Create a development build using Webpack
      features:
        - Sourcemaps
        - Hot reloading of source code

    - name: build:prod
      tasks: ['webpack -p --progress --config <%= paths.config.configDir %>webpack/prod.webpack.config.js']
      description: Create a production build using Webpack
      features:
        - Minifies source code
        - Sourcemaps
        - Dead code removal
        - Hashes added to file names for cache-busting

  templateFiles:
    - src: webpack.config.js.tpl
      dest: <%= paths.config.configDir %>webpack/webpack.config.js
      overwrite: true

    - src: dev.webpack.config.js
      dest: <%= paths.config.configDir %>webpack/dev.webpack.config.js
      overwrite: true

    - src: prod.webpack.config.js
      dest: <%= paths.config.configDir %>webpack/prod.webpack.config.js
      overwrite: true

    - src: webpackHelpers.js
      dest: <%= paths.config.configDir %>webpack/webpackHelpers.js
      overwrite: true

  readme:
    extensionPoint:
      start: >
        `npm start` can be extended by modifying <%= link(paths.config.configDir + 'webpack/dev.webpack.config.js') %>
        and <%= link(paths.config.configDir + 'webpack/prod.webpack.config.js') %>. Confit will attempt to overwrite the contents
        files the next time `yo confit` is run, so make sure any modifications are committed to source control first.

  toolModules:
    - condition: <%- buildJS.sourceFormat === 'TypeScript' %>
      packages:
        - <<: *pkg_@types/source-map
        - <<: *pkg_@types/uglify-js
        - <<: *pkg_@types/webpack

buildAssets:
  packages:
    - <<: *pkg_file-loader


buildCSS:
  # Common packages
  packages:
    - <<: *pkg_css-loader
    - <<: *pkg_style-loader
    - <<: *pkg_autoprefixer
    - <<: *pkg_postcss-loader

  toolModules:
    - condition: <%- config.buildCSS && buildCSS.sourceFormat === 'stylus' %>
      packages:
        - <<: *pkg_stylus
        - <<: *pkg_stylus-loader

    - condition: <%- config.buildCSS && buildCSS.sourceFormat === 'sass' %>
      packages:
        - <<: *pkg_sass-loader
        - <<: *pkg_node-sass


buildHTML:
  packages:
    - <<: *pkg_html-loader
    - <<: *pkg_html-webpack-plugin


buildJS:
  toolModules:
    - condition: <%- buildJS.sourceFormat === 'ES6' %>
      packages:
        - <<: *pkg_babel-loader

    - condition: <%- buildJS.sourceFormat === 'TypeScript' %>
      packages:
        - <<: *pkg_awesome-typescript-loader
        - <<: *pkg_angular2-template-loader

    - condition: <%- buildJS.framework.indexOf('React (latest)') > -1 %>
      packages:
        - <<: *pkg_react-hot-loader

# sampleApp configuration
sampleApp:

  # Special config for certain frameworks
  frameworks:
    '': # This is the 'none' framework
      ES6: {}
      TypeScript: {}
    AngularJS 1.x:
      ES6:
        vendorScripts:  # Add these items to the vendor scripts entryPoint
          post:
            - angular-route
      TypeScript:
        vendorScripts:
          post:
            - angular-route
    AngularJS 2.x:
      TypeScript:
        vendorScripts:
          pre:
            - './polyfills.browser.ts'
          post:
            - '@angular/router'

    React (latest):
      ES6:
        vendorScripts:
          pre:
            - './polyfills.js'
          post:
            - 'react-router'

  toolModules:
    - condition: <%- buildJS.framework.length === 0 && buildJS.sourceFormat === 'ES6' %>
      templateFiles:
        - src: noFramework/ES6/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: noFramework/ES6/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: noFramework/ES6/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true
        - src: noFramework/ES6/demoModule/templates/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.templateDir %>
          overwrite: true

    - condition: <%- buildJS.framework.length === 0 && buildJS.sourceFormat === 'TypeScript' %>
      templateFiles:
        - src: noFramework/TypeScript/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: noFramework/TypeScript/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: noFramework/TypeScript/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true
        - src: noFramework/TypeScript/demoModule/templates/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.templateDir %>
          overwrite: true

    - condition: <%- buildJS.framework.indexOf('AngularJS 1.x') > -1 && buildJS.sourceFormat === 'ES6' %>
      packages:
        - <<: *pkg_angular-route
      testPackages:
        - <<: *pkg_angular-route
      templateFiles:
        - src: ng1/ES6/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: ng1/ES6/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: ng1/ES6/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true
        - src: ng1/ES6/demoModule/templates/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.templateDir %>
          overwrite: true

    - condition: <%- buildJS.framework.indexOf('AngularJS 1.x') > -1 && buildJS.sourceFormat === 'TypeScript' %>
      packages:
        - <<: *pkg_angular-route
      testPackages:
        - <<: *pkg_angular-route
      templateFiles:
        - src: ng1/TypeScript/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: ng1/TypeScript/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: ng1/TypeScript/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true
        - src: ng1/TypeScript/demoModule/templates/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.templateDir %>
          overwrite: true

    - condition: <%- buildJS.framework.indexOf('AngularJS 2.x') > -1 && buildJS.sourceFormat === 'TypeScript' %>
      packages:
        - <<: *pkg_@angular/router
      testPackages: []
      templateFiles:
        - src: ng2/TypeScript/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: ng2/TypeScript/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: ng2/TypeScript/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true
        - src: ng2/TypeScript/demoModule/templates/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.templateDir %>
          overwrite: true

    - condition: <%- buildJS.framework.indexOf('React (latest)') > -1 %>
      packages:
        - <<: *pkg_react-router
        - <<: *pkg_object-assign    # In polyfills.js
        - <<: *pkg_promise          # In polyfills.js
        - <<: *pkg_whatwg-fetch     # In polyfills.js
      templateFiles:
        - src: react/*
          dest: <%= paths.input.srcDir %>
          overwrite: true
          noParse: true
        - src: react/demoModule/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir %>
          overwrite: true
        - src: react/demoModule/unitTest/*
          dest: <%- paths.input.srcDir + resources.sampleApp.demoDir + paths.input.unitTestDir %>
          overwrite: true



serverDev:
  packages:
    - <<: *pkg_js-yaml
  tasks:
    - name: serve:dev
      tasks: ['echo Starting DEV server']
      description: Runs a dev server using `webpack-dev-server` on **<%= serverDev.protocol + '://' + serverDev.hostname + ':' + serverDev.port %>**
      features:
        - HTTP or HTTPS
        - LiveReload support for HTML & CSS
        - Hot module reloading

testUnit:
  # Use different coverage loaders for TypeScript as there currently isn't a loader that understands TypeScript natively?
  sourceFormat:
    ES6:
      packages:
        - <<: *pkg_babel-plugin-istanbul

    TypeScript:
      packages:
        - <<: *pkg_istanbul-instrumenter-loader

  packages:
    - <<: *pkg_karma
    - <<: *pkg_karma-chrome-launcher
    - <<: *pkg_karma-coverage
    - <<: *pkg_karma-jasmine
    - <<: *pkg_karma-junit-reporter
    - <<: *pkg_karma-sourcemap-loader
    - <<: *pkg_karma-threshold-reporter
    - <<: *pkg_karma-webpack
    - <<: *pkg_jasmine-core
    - <<: *pkg_@types/jasmine

  tasks:
    - name: test
      tasks: ['npm run test:unit']
      description: Alias for `npm run test:unit` task
      features: []

    - name: test:unit
      tasks: ['cross-env BABEL_ENV=test NODE_ENV=test karma start ./<%= paths.config.configDir + resources.testUnit.configSubDir %>karma.conf.js']
      description: Run unit tests whenever JS source or tests change
      features:
        - Uses Karma and Jasmine 2
        - Code coverage
        - Runs continuously (best to run in a separate window)

    - name: test:unit:once
      tasks: ['cross-env BABEL_ENV=test NODE_ENV=test karma start --singleRun=true ./<%= paths.config.configDir + resources.testUnit.configSubDir %>karma.conf.js']
      description: Run unit tests once
      features:
        - Tests are run a single time
        - Good command for continuous integration testing

    - name: test:unit:debug   # Deliberately don't add the BABEL_ENV for debugging
      tasks: ['cross-env NODE_ENV=test karma start ./<%= paths.config.configDir + resources.testUnit.configSubDir %>karma.conf.js --debug']
      description: Run unit tests but disable code coverage to make debugging in a browser easier
      features:
        - Runs continuously (best to run in a separate window)
        - No code coverage to make it easier to read source & testcode

    - name: test:unit:debug:once   # Deliberately don't add the BABEL_ENV for debugging
      tasks: ['cross-env NODE_ENV=test karma start --singleRun=true ./<%= paths.config.configDir + resources.testUnit.configSubDir %>karma.conf.js --debug']
      description: # Only used for integration testing


    - name: test:coverage   # Used by the pre-release / release task
      tasks: ['npm run test:unit:once']
      description: Alias for test:unit:once, which also does test coverage checks and will fail if test coverage is not sufficient

  templateFiles:
    - src: karma.conf.js.tpl
      dest: <%= paths.config.configDir + resources.testUnit.configSubDir%>karma.conf.js
      overwrite: true

    - src: karma.common.js.tpl
      dest: <%= paths.config.configDir + resources.testUnit.configSubDir%>karma.common.js
      overwrite: true

    - src: test.files.js.tpl
      dest: <%= paths.config.configDir + resources.testUnit.configSubDir%>test.files.js
      overwrite: true

    - src: thresholds.json
      dest: <%= paths.config.configDir + resources.testUnit.configSubDir%>thresholds.json


  readme:
    extensionPoint:
      testUnit: >
        `npm test:unit` can be extended by modifying
        <%= link(paths.config.configDir + resources.testUnit.configSubDir + 'karma.conf.js') %> and <%= link(paths.config.configDir + resources.testUnit.configSubDir + 'karma.common.js') %>.
        <%= link(paths.config.configDir + resources.testUnit.configSubDir + 'test.files.js') %> is generated from the entry points in the Confit configuration.
        It is **best** to modify the entry points in <%= link(configFile) %> then re-run `yo confit`.

        Note that it is possible to run a subset of unit tests by passing a command line argument to Karma, and then modifying the `testFilesRegEx`
        variable in <%= link(paths.config.configDir + resources.testUnit.configSubDir + 'karma.common.js') %> to refer to the command line argument value.
        For example, if the command is `...karma.conf.js --spec=testb`, then `karma.common.js` can access this value through `process.argv.indexOf('--spec=testb')`,
        which can then be used to change the default value of `testFilesRegEx`.