Skip to content

Instantly share code, notes, and snippets.

@evsasse

evsasse/app-slash-index.html

Last active January 19, 2017 13:24
Show Gist options
  • Save evsasse/829c6303e41a3eae2ab57ba09ae42838 to your computer and use it in GitHub Desktop.
Save evsasse/829c6303e41a3eae2ab57ba09ae42838 to your computer and use it in GitHub Desktop.
Download ZIP
webpack's file-loader [name] different behaviour on windows and linux
Raw
app-slash-index.html
<!DOCTYPE html>
<html>
<head>
<title>Your app name</title>
<meta charset="utf-8">
</head>
<body>
<div id="appMountPoint"></div>
outside
<script src="bundle.js"></script>
</body>
</html>
Raw
app-slash-index.js
import React from 'react';
import ReactDOM from 'react-dom';
ReactDOM.render(
<h1>inside</h1>,
document.getElementById('appMountPoint')
)
Raw
package.json
{
"name": "some-webpack-boilerplate",
"version": "1.0.0",
"main": "index.js",
"author": "Evandro Sasse <evsasse@gmail.com>",
"license": "MIT",
"scripts": {
"dist": "node ./node_modules/webpack/bin/webpack.js",
"dev": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --content-base dist/"
},
"dependencies": {
"babel-core": "^6.21.0",
"babel-loader": "^6.2.10",
"babel-preset-latest": "^6.16.0",
"babel-preset-react": "^6.16.0",
"file-loader": "^0.9.0",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"webpack": "^1.14.0",
"webpack-dev-server": "^1.16.2"
}
}
Raw
webpack.config.js
module.exports = {
context: __dirname + "/app",
entry: {
javascript: "./index.js",
html: "./index.html",
},
output: {
filename: "bundle.js",
path: "./dist",
},
resolve: {
extensions: ['', '.js', '.jsx', '.json'],
},
module: {
loaders: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loaders: ["babel-loader"],
}, {
test: /\.(html)$/,
loaders: ["file?name=[name].[ext]"],
},
],
},
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment