Skip to content

top-solution/angularjs-webpack-seed

Repository files navigation

WARNING

This repository is way old and unmaintained, we're keeping it there just for reference.

If you're going to develop a new JavaScript single page application, consider using a newer framework like React, Vue.js or the modern Angular.

AngularJS + webpack seed project

An AngularJS + webpack seed project, supporting ES2015+ syntax through Babel compiler; ESLint and stylelint will assist you writing beautiful code. To add jQuery, refer to the section Use jQuery with angular.element.

It comes with preconfigured

Supported browsers (in browserlist format) are:

last 2 versions
ie >= 10

Pre-requisites

Required:

  • Node.js with npm, the current LTS version is an ideal starting point

Recommended:

  • Yarn a fast and reliable npm alternative

Optional:

  • Caddy a very easy HTTP server, install only if you want to test the build in a browser

The following instructions will assume you have installed yarn, you can use npm equivalents without known issues.

Usage

Fork or download the project then install dependencies

$ yarn install

Development

$ yarn run dev

The project will be available at http://localhost:8000/.

Building

$ yarn run build

If you want to see the build in a browser run

$ caddy

The build will be available at http://localhost:8001/.

Use jQuery with angular.element

You may want to supercharge angular.element with jQuery selector powers, then you have to

$ yarn add jquery

then drop the WebpackProvide plugin in conf/webpack.conf.js:

[...]
module.exports = {
  plugins: [
    new webpack.ProvidePlugin({
      'window.jQuery': 'jquery',
      jQuery: 'jquery',
      $: 'jquery'
    }),
[...]

Refer to Johnny Reilly for an explaination.

Known issues

  • Internet Explorer 10 is not supported in development mode

Contribute

Want to help? Feel free to open any issue or pull request, but please submit only warnings-free versions to review.