Bharat Tiwari b-tiwari

## dabblet.css
/**
 * The first commented line is your dabblet’s title
 */

background: #fff;
background: linear-gradient(45deg, #fff, grey);
min-height: 100%;

## app.js
console.log('Welcome from app.js');

## package.json
{
  "name": "learn-webpack2",
  "version": "1.0.0",
  "description": "learn webpack2",
  "main": "index.js",
  "scripts": {
        "start": "webpack ./src/scripts/app.js ./dist/app.bundle.js"
  },
  "author": "Bharat Tiwari",
  "license": "ISC"

## webpack.config.js
module.exports = {
  entry: "./src/scripts/app.js",//path relative to this file
  output: {
      filename: "./dist/app.bundle.js"//path relative to this file
  }
}


## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>My Awesome application</title>
  </head>

  <body>
    <h1>Hello World</h1>

## webpack.config.js
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {

    entry: "./src/scripts/app.js", //relative to root of the application
    output: {
        filename: "./dist/app.bundle.js" //relative to root of the application
    },
    plugins: [
        new HtmlWebpackPlugin({

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>

  <body>
    <h1> <%= htmlWebpackPlugin.options.myPageHeader %> </h1>
    <h3>Welcome to the Awesome application</h3>

## webpack.config.js
...
...
    plugins: [
        new HtmlWebpackPlugin({
            hash: true,
            title: 'My Awesome application',
            myPageHeader: 'Hello World',
            template: './src/index.html',
            filename: './dist/index.html' //relative to root of the application
        })

## webpack.config.js
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {

    entry: "./src/scripts/app.js", //relative to root of the application
    output: {
        filename: "./dist/app.bundle.js" //relative to root of the application
    },
    watch:true,
    plugins: [

## my-helper-module.js
module.exports = {
  greetings: 'Hello from my-helper-module!!'
};
	/**
	* The first commented line is your dabblet’s title
	*/

	background: #fff;
	background: linear-gradient(45deg, #fff, grey);
	min-height: 100%;
	{
	"name": "learn-webpack2",
	"version": "1.0.0",
	"description": "learn webpack2",
	"main": "index.js",
	"scripts": {
	"start": "webpack ./src/scripts/app.js ./dist/app.bundle.js"
	},
	"author": "Bharat Tiwari",
	"license": "ISC"
	module.exports = {
	entry: "./src/scripts/app.js",//path relative to this file
	output: {
	filename: "./dist/app.bundle.js"//path relative to this file
	}
	}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>My Awesome application</title>
	</head>

	<body>
	<h1>Hello World</h1>
	var HtmlWebpackPlugin = require('html-webpack-plugin');

	module.exports = {

	entry: "./src/scripts/app.js", //relative to root of the application
	output: {
	filename: "./dist/app.bundle.js" //relative to root of the application
	},
	plugins: [
	new HtmlWebpackPlugin({
	...
	...
	plugins: [
	new HtmlWebpackPlugin({
	hash: true,
	title: 'My Awesome application',
	myPageHeader: 'Hello World',
	template: './src/index.html',
	filename: './dist/index.html' //relative to root of the application
	})
	module.exports = {
	greetings: 'Hello from my-helper-module!!'
	};