Here is my current configuration and file structure. It successfully builds. There are no errors in my browser console. Just a blank page. I serve the dist
folder. I installed all dependencies via npm
. I had an initial error - angular is not defined
- but I resolved that by installing the angular module. At the very least, it told me that server really is serving the dist
folder.
The html file in my dist folder
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lightbox</title>
</head>
<body>
<script type="text/javascript" src="bundle.js"></script></body>
</html>
My Webpack config
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: path.resolve(__dirname, './client/js/app.js'),
output: {
path: path.resolve(__dirname, './dist'),
filename: 'bundle.js',
},
module: {
loaders: [
{
test: /\.(css|sass)$/,
loaders: ['style-loader', 'css-loader', 'sass-loader'],
},
{
test: /\.(png|jpg)$/,
loader: 'url-loader',
query: { mimetype: 'image/png' },
}
],
},
plugins: [new HtmlWebpackPlugin()],
};
And my package.json
{
"name": "",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node node_modules/.bin/webpack-dev-server --content-base dist"
},
"repository": {
"type": "git",
"url": ""
},
"author": "",
"license": "ISC",
"bugs": {
"url": ""
},
"homepage": "",
"dependencies": {
"angular": "^1.6.4",
"angular-route": "^1.6.4",
"angular-utils-pagination": "^0.11.1",
"css-loader": "^0.28.0",
"express": "^4.15.2",
"html-webpack-plugin": "^2.28.0",
"node-sass": "^4.5.2",
"sass-loader": "^6.0.3",
"style-loader": "^0.16.1",
"url-loader": "^0.5.8",
"webpack": "^2.4.1"
},
"devDependencies": {
"eslint": "^3.19.0",
"eslint-config-airbnb": "^14.1.0",
"webpack": "^2.4.1",
"webpack-dev-server": "^2.4.5"
}
}
My server
const express = require('express');
const path = require('path')
const app = express();
const port = 8080;
app.listen(port)
app.use(express.static(path.join(__dirname, '../dist')));
via colbisaurusrex
No comments:
Post a Comment