Initial commit: webpack building a blank canvas
This commit is contained in:
commit
391182251c
9
.eslintrc.js
Normal file
9
.eslintrc.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
module.exports = {
|
||||||
|
"extends": "airbnb-base",
|
||||||
|
"plugins": [
|
||||||
|
"import"
|
||||||
|
],
|
||||||
|
"env": {
|
||||||
|
"browser": true,
|
||||||
|
}
|
||||||
|
};
|
||||||
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
node_modules/
|
||||||
|
dist/
|
||||||
|
tags
|
||||||
|
Session.vim
|
||||||
20
LICENSE.txt
Normal file
20
LICENSE.txt
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2017 Tyler Hallada
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
this software and associated documentation files (the "Software"), to deal in
|
||||||
|
the Software without restriction, including without limitation the rights to
|
||||||
|
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||||
|
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||||
|
subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||||
|
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||||
|
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||||
|
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||||
|
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
32
README.md
Normal file
32
README.md
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
# Transport
|
||||||
|
|
||||||
|
A generative art project in progress.
|
||||||
|
|
||||||
|
## Development
|
||||||
|
|
||||||
|
Clone the repo and then run:
|
||||||
|
|
||||||
|
```
|
||||||
|
npm install
|
||||||
|
npm start
|
||||||
|
```
|
||||||
|
|
||||||
|
Then visit `http://localhost:8888` in your browser to view the development
|
||||||
|
build. Edit files in `/src` and see the changes reflected in the browser.
|
||||||
|
|
||||||
|
## Test
|
||||||
|
|
||||||
|
No tests right now. But, to run lint checks:
|
||||||
|
|
||||||
|
```
|
||||||
|
npm run lint
|
||||||
|
```
|
||||||
|
|
||||||
|
## Deploy
|
||||||
|
|
||||||
|
Run:
|
||||||
|
|
||||||
|
```
|
||||||
|
npm run build
|
||||||
|
npm run deploy
|
||||||
|
```
|
||||||
27
index.html
Normal file
27
index.html
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<title>Transport</title>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<!-- open graph tags -->
|
||||||
|
<meta property="og:title" content="Transport" />
|
||||||
|
<!-- <meta property="og:url" content="http://transport.hallada.net/" /> -->
|
||||||
|
<!-- <meta property="og:image" content="http://proximity.hallada.net/img/proximity-300-zoomed.png" /> -->
|
||||||
|
<!-- <meta property="og:image:type" content="image/png" /> -->
|
||||||
|
<!-- <meta property="og:image:width" content="300" /> -->
|
||||||
|
<!-- <meta property="og:image:height" content="300" /> -->
|
||||||
|
<!-- <meta property="og:image:alt" content="Screenshot of the animation in action" /> -->
|
||||||
|
<!-- <meta property="og:description" content="A procedurally generated and interactive animation created with PixiJS" /> -->
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<!-- Google Analytics -->
|
||||||
|
<script>
|
||||||
|
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
|
||||||
|
ga('create', 'UA-39880341-1', 'auto');
|
||||||
|
ga('send', 'pageview');
|
||||||
|
</script>
|
||||||
|
<script async src='https://www.google-analytics.com/analytics.js'></script>
|
||||||
|
<!-- End Google Analytics -->
|
||||||
|
</html>
|
||||||
12766
package-lock.json
generated
Normal file
12766
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
41
package.json
Normal file
41
package.json
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
{
|
||||||
|
"name": "transport",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"start": "NODE_ENV=development ./node_modules/.bin/webpack-dev-server --mode development",
|
||||||
|
"build": "NODE_ENV=production ./node_modules/.bin/webpack --mode production",
|
||||||
|
"deploy": "./node_modules/.bin/gh-pages -d dist",
|
||||||
|
"lint": "./node_modules/.bin/eslint src/",
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
|
},
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "git@git.hallada.net:pixi.git"
|
||||||
|
},
|
||||||
|
"author": "Tyler Hallada",
|
||||||
|
"license": "ISC",
|
||||||
|
"devDependencies": {
|
||||||
|
"@babel/core": "^7.0.0-beta.42",
|
||||||
|
"@babel/preset-env": "^7.0.0-beta.42",
|
||||||
|
"babel-loader": "^8.0.0-beta.2",
|
||||||
|
"css-loader": "^0.28.11",
|
||||||
|
"eslint": "^3.17.0",
|
||||||
|
"eslint-config-airbnb-base": "^11.1.1",
|
||||||
|
"eslint-config-standard": "^7.0.0",
|
||||||
|
"eslint-plugin-import": "^2.2.0",
|
||||||
|
"eslint-plugin-promise": "^3.5.0",
|
||||||
|
"eslint-plugin-standard": "^2.1.1",
|
||||||
|
"extract-text-webpack-plugin": "^4.0.0-beta.0",
|
||||||
|
"gh-pages": "^1.1.0",
|
||||||
|
"html-webpack-plugin": "^3.1.0",
|
||||||
|
"style-loader": "^0.20.3",
|
||||||
|
"webpack": "^4.4.1",
|
||||||
|
"webpack-cli": "^2.0.13",
|
||||||
|
"webpack-dev-server": "^3.1.1"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"pixi.js": "^4.7.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
20
src/style.css
Normal file
20
src/style.css
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body, canvas {
|
||||||
|
overflow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
canvas {
|
||||||
|
position: fixed !important;
|
||||||
|
left: 0 !important;
|
||||||
|
right: 0 !important;
|
||||||
|
bottom: 0 !important;
|
||||||
|
top: 0 !important;
|
||||||
|
}
|
||||||
10
src/transport.js
Normal file
10
src/transport.js
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import * as PIXI from 'pixi.js';
|
||||||
|
import './style.css';
|
||||||
|
|
||||||
|
const app = new PIXI.Application(window.innerWidth, window.innerHeight);
|
||||||
|
|
||||||
|
document.body.appendChild(app.view);
|
||||||
|
|
||||||
|
window.addEventListener('resize', () => {
|
||||||
|
app.renderer.resize(window.innerWidth, window.innerHeight);
|
||||||
|
});
|
||||||
51
webpack.config.js
Normal file
51
webpack.config.js
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
const path = require('path');
|
||||||
|
const ExtractTextPlugin = require('extract-text-webpack-plugin');
|
||||||
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||||
|
|
||||||
|
const env = process.env.NODE_ENV;
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
entry: './src/transport.js',
|
||||||
|
output: {
|
||||||
|
filename: 'transport.js',
|
||||||
|
path: path.resolve(__dirname, 'dist'),
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /\.js$/,
|
||||||
|
exclude: /node_modules/,
|
||||||
|
use: {
|
||||||
|
loader: 'babel-loader',
|
||||||
|
options: {
|
||||||
|
presets: ['@babel/preset-env'],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.css$/,
|
||||||
|
use: env === 'production'
|
||||||
|
? ExtractTextPlugin.extract({
|
||||||
|
fallback: 'style-loader',
|
||||||
|
use: ['css-loader'],
|
||||||
|
})
|
||||||
|
: ['style-loader', 'css-loader'],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: path.join(__dirname, 'index.html'),
|
||||||
|
}),
|
||||||
|
new ExtractTextPlugin({
|
||||||
|
disable: env === 'development',
|
||||||
|
filename: '[name].css',
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
devServer: {
|
||||||
|
contentBase: path.join(__dirname, 'dist'),
|
||||||
|
host: '0.0.0.0',
|
||||||
|
port: 8888,
|
||||||
|
disableHostCheck: true,
|
||||||
|
},
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue
Block a user