Skip to content
This repository has been archived by the owner on Feb 17, 2024. It is now read-only.

Updates required for latest version of webpack and fixed bundle reference in index.html #7

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Updates required for latest version of webpack and fixed bundle reference in index.html #7

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
4596bfa
README update
robinsonaaron Sep 13, 2017
3e8cd4a
Added install of babel-core
robinsonaaron Sep 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ Create `client/index.html`
<meta charset="UTF-8">
</head>
<body>
<script src="bundle.js"></script>
<script src="./client/bundle.js"></script>
</body>
</html>
```
Expand Down Expand Up @@ -87,8 +87,9 @@ Update your browser window and you should see the alert `It works from content.j
#### Add ES6 to our app
We want to add ES6 to our application. Webpack can only handle ES5 natively, so we need the babel-loader to process js files written with ES6 down to ES5. We can install [any of the webpack loaders](http://webpack.github.io/docs/list-of-loaders.html) through `npm`.

Run `npm init`. Default options are fine.
Run `npm install babel-loader --save-dev`
Run `npm init`. Default options are fine. Just repeatedly hit enter.

Run `npm install babel-core babel-loader --save-dev`

ES6ify `client/content.js`
```js
Expand All @@ -104,7 +105,7 @@ alert(`${greeting} and with ES6!!`)
```

Now, we can use a special flag in our CLI to send all `.js` files through babel. Recompile your beautiful new ES6 app:
`webpack ./client/app.js ./client/bundle.js --module-bind 'js=babel'`
`webpack ./client/app.js ./client/bundle.js --module-bind 'js=babel-loader'`

Update your browser window and you should see the alert `It works from content.js`

Expand Down