├── .editorconfig ├── .eslintrc.json ├── .gitattributes ├── .gitignore ├── LICENSE ├── package.json ├── src └── application.js └── webpack.config.js /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = tab 5 | tab_width = 4 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "node": false, 4 | "browser": false, 5 | "commonjs": false, 6 | "es6": true 7 | }, 8 | "parserOptions": { 9 | "sourceType": "module", 10 | "allowImportExportEverywhere": false, 11 | "ecmaVersion": 6, 12 | "ecmaFeatures": { 13 | "arrowFunctions": true, 14 | "templateStrings": true, 15 | "jsx": false, 16 | "experimentalObjectRestSpread": false 17 | } 18 | }, 19 | "rules": { 20 | "no-cond-assign": ["error", "always"], 21 | "no-console": 0, 22 | "no-constant-condition": "error", 23 | "no-control-regex": "error", 24 | "no-debugger": "error", 25 | "no-dupe-args": "error", 26 | "no-dupe-keys": "error", 27 | "no-duplicate-case": "error", 28 | "no-empty": "error", 29 | "no-empty-character-class": "error", 30 | "no-ex-assign": "error", 31 | "no-extra-boolean-cast": "error", 32 | "no-extra-parens": 0, 33 | "no-extra-semi": "warn", 34 | "no-func-assign": "error", 35 | "no-inner-declarations": "error", 36 | "no-invalid-regexp": "error", 37 | "no-irregular-whitespace": ["error", {"skipStrings": true, "skipComments": true, "skipRegExps": true, "skipTemplates": true }], 38 | "no-negated-in-lhs": "error", 39 | "no-obj-calls": "error", 40 | "no-prototype-builtins": "error", 41 | "no-regex-spaces": "warn", 42 | "no-sparse-arrays": "error", 43 | "no-unexpected-multiline": "error", 44 | "no-unreachable": "error", 45 | "no-unsafe-finally": "error", 46 | "use-isnan": "error", 47 | "valid-jsdoc": 0, 48 | "valid-typeof": "error", 49 | 50 | "accessor-pairs": ["error", {"setWithoutGet": true, "getWithoutSet": false}], 51 | "array-callback-return": "error", 52 | "block-scoped-var": "error", 53 | "consistent-return": "error", 54 | "curly": "error", 55 | "default-case": 0, 56 | "dot-location": ["error", "property"], 57 | "dot-notation": ["error", {"allowKeywords": false}], 58 | "eqeqeq": "error", 59 | "guard-for-in": 0, 60 | "no-alert": "error", 61 | "no-caller": "error", 62 | "no-case-declarations": "error", 63 | "no-div-regex": "error", 64 | "no-else-return": "error", 65 | "no-empty-function": "warn", 66 | "no-empty-pattern": "error", 67 | "no-eval": "error", 68 | "no-extend-native": "error", 69 | "no-extra-bind": "error", 70 | "no-fallthrough": "error", 71 | "no-floating-decimal": "error", 72 | "no-implicit-coercion": "error", 73 | "no-implicit-globals": "error", 74 | "no-implied-eval": "error", 75 | "no-invalid-this": "error", 76 | "no-iterator": "error", 77 | "no-labels": "error", 78 | "no-lone-blocks": "error", 79 | "no-loop-func": "error", 80 | "no-magic-numbers": 0, 81 | "no-multi-spaces": "error", 82 | "no-multi-str": "error", 83 | "no-native-reassign": "error", 84 | "no-new": "error", 85 | "no-new-func": 0, 86 | "no-new-wrappers": "error", 87 | "no-octal": "error", 88 | "no-octal-escape": "error", 89 | "no-param-reassign": "error", 90 | "no-proto": "error", 91 | "no-redeclare": "error", 92 | "no-return-assign": "error", 93 | "no-script-url": "error", 94 | "no-self-assign": "error", 95 | "no-self-compare": "error", 96 | "no-sequences": "error", 97 | "no-throw-literal": "error", 98 | "no-unmodified-loop-condition": "error", 99 | "no-unused-expressions": "warn", 100 | "no-useless-call": "warn", 101 | "no-useless-concat": "error", 102 | "no-useless-escape": "warn", 103 | "no-void": "error", 104 | "no-warning-comments": ["warn", { "terms": ["todo", "todelete", "uncomment"], "location": "anywhere" }], 105 | "no-with": "error", 106 | "radix": "error", 107 | "vars-on-top": "error", 108 | "wrap-iife": ["error", "any"], 109 | "yoda": ["error", "never"], 110 | 111 | "strict": [2, "global"], 112 | 113 | "init-declarations": 0, 114 | "no-catch-shadow": "error", 115 | "no-delete-var": "error", 116 | "no-shadow": ["error", {"builtinGlobals": true, "hoist": "all"}], 117 | "no-shadow-restricted-names": "error", 118 | "no-undef": "error", 119 | "no-undef-init": "error", 120 | "no-undefined": "error", 121 | "no-unused-vars": "error", 122 | "no-use-before-define": ["error", {"functions": false, "classes": true}], 123 | 124 | "callback-return": 0, 125 | "global-require": "error", 126 | "handle-callback-err": "warn", 127 | "no-mixed-requires": 0, 128 | "no-new-require": "error", 129 | "no-path-concat": "error", 130 | "no-process-env": "warn", 131 | "no-process-exit": "error", 132 | "no-sync": "error", 133 | 134 | "array-bracket-spacing": ["error", "never"], 135 | "block-spacing": ["error", "never"], 136 | "brace-style": [2, "1tbs", {"allowSingleLine": false}], 137 | "camelcase": 0, 138 | "comma-dangle": ["error", "never"], 139 | "comma-spacing": ["error", {"before": false, "after": true}], 140 | "comma-style": ["error", "last"], 141 | "computed-property-spacing": ["error", "never"], 142 | "consistent-this": ["error", "self"], 143 | "eol-last": ["error"], 144 | "func-names": 0, 145 | "func-style": ["error", "declaration", {"allowArrowFunctions": true}], 146 | "id-length": 0, 147 | "id-match": 0, 148 | "indent": ["error", "tab", {"SwitchCase": 1}], 149 | "jsx-quotes": ["error", "prefer-double"], 150 | "key-spacing": ["error", {"beforeColon": false, "afterColon": true}], 151 | "linebreak-style": ["error", "unix"], 152 | "lines-around-comment": 0, 153 | "max-depth": ["error", {"max": 8}], 154 | "max-len": [1, 140, 4, {"ignoreComments": true, "ignoreUrls": true}], 155 | "max-lines": [0], 156 | "max-nested-callbacks": ["error", 5], 157 | "max-params": ["error", 10], 158 | "max-statements": ["error", 100], 159 | "max-statements-per-line": ["error", {"max": 1}], 160 | "new-cap": ["error", {"newIsCap": true, "capIsNew": true}], 161 | "new-parens": "error", 162 | "newline-after-var": 0, 163 | "newline-before-return": 0, 164 | "newline-per-chained-call": ["error", { "ignoreChainWithDepth": 3 }], 165 | "no-array-constructor": "error", 166 | "no-bitwise": "error", 167 | "no-continue": "error", 168 | "no-inline-comments": 0, 169 | "no-lonely-if": "error", 170 | "no-mixed-operators": "error", 171 | "no-mixed-spaces-and-tabs": "error", 172 | "no-multiple-empty-lines": ["error", {"max": 2, "maxEOF": 1, "maxBOF": 1}], 173 | "no-negated-condition": 0, 174 | "no-nested-ternary": "error", 175 | "no-new-object": "error", 176 | "no-plusplus": 0, 177 | "no-restricted-syntax": 0, 178 | "no-spaced-func": "error", 179 | "no-ternary": 0, 180 | "no-trailing-spaces": "error", 181 | "no-underscore-dangle": "error", 182 | "no-unneeded-ternary": "error", 183 | "no-whitespace-before-property": "error", 184 | "object-curly-newline": 0, 185 | "object-curly-spacing": 0, 186 | "object-property-newline": 0, 187 | "one-var": ["error", "never"], 188 | "one-var-declaration-per-line": ["error", "always"], 189 | "operator-assignment": ["error", "always"], 190 | "operator-linebreak": ["error", "before"], 191 | "padded-blocks": ["error", "never"], 192 | "quote-props": ["error", "as-needed"], 193 | "quotes": [2, "single", {"allowTemplateLiterals": true}], 194 | "semi": ["error", "always"], 195 | "semi-spacing": ["error", {"before": false, "after": true}], 196 | "sort-vars": 0, 197 | "space-before-blocks": ["error", { 198 | "functions": "never", 199 | "keywords": "never", 200 | "classes": "always" 201 | }], 202 | "space-before-function-paren": ["error", "never"], 203 | "space-in-parens": ["error", "never"], 204 | "space-infix-ops": "error", 205 | "space-unary-ops": ["error", {"words": true, "nonwords": false}], 206 | "spaced-comment": 0, 207 | "unicode-bom": "error", 208 | "wrap-regex": 0, 209 | 210 | "arrow-body-style": ["error", "as-needed"], 211 | "arrow-parens": ["error", "as-needed"], 212 | "arrow-spacing": ["error", {"before": true, "after": true}], 213 | "constructor-super": "error", 214 | "generator-star-spacing": ["error", {"before": false, "after": true}], 215 | "no-class-assign": "error", 216 | "no-confusing-arrow": "error", 217 | "no-const-assign": "error", 218 | "no-dupe-class-members": "error", 219 | "no-duplicate-imports": "error", 220 | "no-new-symbol": "error", 221 | "no-this-before-super": "error", 222 | "no-useless-computed-key": "error", 223 | "no-useless-constructor": "error", 224 | "no-useless-rename": "error", 225 | "no-var": "error", 226 | "object-shorthand": "error", 227 | "prefer-arrow-callback": "error", 228 | "prefer-const": ["error", {"destructuring": "all"}], 229 | "prefer-reflect": 0, 230 | "prefer-rest-params": "error", 231 | "prefer-spread": "error", 232 | "prefer-template": "error", 233 | "require-yield": "error", 234 | "rest-spread-spacing": ["error", "never"], 235 | "sort-imports": 0, 236 | "template-curly-spacing": ["error", "never"], 237 | "yield-star-spacing": ["error", {"before": false, "after": true}] 238 | } 239 | } 240 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | 2 | * -text 3 | 4 | .editorconfig text 5 | .gitattributes text 6 | .gitignore text 7 | .gitattributes text 8 | LICENSE text 9 | README text 10 | *.txt text 11 | *.md text 12 | *.js text 13 | *.jsx text 14 | *.json text 15 | *.css text 16 | *.html text 17 | 18 | *.jpg binary 19 | *.gif binary 20 | *.png binary 21 | *.svg text 22 | *.mp4 binary 23 | *.ogv binary 24 | *.webm binary 25 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | #-----------------------------------------------------------------------------# 3 | # Ignore everything by default: 4 | #-----------------------------------------------------------------------------# 5 | 6 | /* 7 | /*/ 8 | 9 | 10 | #-----------------------------------------------------------------------------# 11 | # But allow those files and folders: 12 | #-----------------------------------------------------------------------------# 13 | 14 | !.editorconfig 15 | !.eslintrc.json 16 | !.gitattributes 17 | !.gitignore 18 | !README.md 19 | !/src 20 | !/package.json 21 | !/webpack.config.js 22 | 23 | 24 | #-----------------------------------------------------------------------------# 25 | # But make sure to ignore those regardless: 26 | #-----------------------------------------------------------------------------# 27 | 28 | .DS_Store 29 | Thumbs.db 30 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 wildpeaks 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "example", 4 | "description": "Using Three.js with Webpack 2", 5 | "engines": { 6 | "node": ">=7.0.0" 7 | }, 8 | "scripts": { 9 | "start": "webpack-dev-server --port 8000 --env.debug", 10 | "build": "webpack" 11 | }, 12 | "devDependencies": { 13 | "babel-core": "^6.21.0", 14 | "babel-loader": "^6.2.10", 15 | "babel-preset-es2015": "^6.18.0", 16 | "html-webpack-plugin": "^2.26.0", 17 | "three": "^0.83.0", 18 | "webpack": "^2.2.0", 19 | "webpack-dev-server": "^2.2.0" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/application.js: -------------------------------------------------------------------------------- 1 | /* eslint-env browser */ 2 | import {Scene, PerspectiveCamera, WebGLRenderer, BoxGeometry, MeshBasicMaterial, Mesh} from 'three'; 3 | 4 | // Example converted from https://threejs.org/docs/index.html#Manual/Introduction/Creating_a_scene 5 | const scene = new Scene(); 6 | const camera = new PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); 7 | 8 | const renderer = new WebGLRenderer(); 9 | renderer.setSize(window.innerWidth, window.innerHeight); 10 | document.body.appendChild(renderer.domElement); 11 | 12 | const geometry = new BoxGeometry(1, 1, 1); 13 | const material = new MeshBasicMaterial({color: 0x00ff00}); 14 | const cube = new Mesh(geometry, material); 15 | scene.add(cube); 16 | 17 | camera.position.z = 5; 18 | 19 | function render(){ 20 | requestAnimationFrame(render); 21 | cube.rotation.x += 0.1; 22 | cube.rotation.y += 0.1; 23 | renderer.render(scene, camera); 24 | } 25 | 26 | render(); 27 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-env node */ 2 | const path = require('path'); 3 | const webpack = require('webpack'); 4 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 5 | 6 | 7 | module.exports = ({debug = false} = {}) => { 8 | const plugins = [ 9 | new webpack.DefinePlugin({ 10 | 'process.env.NODE_ENV': JSON.stringify(debug ? 'development' : 'production') 11 | }), 12 | new HtmlWebpackPlugin({ 13 | title: 'Example', 14 | filename: 'index.html' 15 | }) 16 | ]; 17 | if (!debug){ 18 | plugins.push( 19 | new webpack.optimize.UglifyJsPlugin({ 20 | sourceMap: 'source-map', 21 | compress: { 22 | warnings: false 23 | }, 24 | output: { 25 | comments: false 26 | } 27 | }) 28 | ); 29 | } 30 | 31 | return { 32 | target: 'web', 33 | devtool: 'source-map', 34 | entry: './src/application.js', 35 | output: { 36 | path: path.resolve(__dirname, 'www'), 37 | filename: debug ? 'bundle.js' : 'bundle.min.js', 38 | publicPath: '' 39 | }, 40 | plugins, 41 | module: { 42 | rules: [ 43 | { 44 | test: /\.js$/, 45 | include: [ 46 | path.resolve(__dirname, 'src') 47 | ], 48 | loader: 'babel-loader', 49 | query: { 50 | compact: true, 51 | presets: [ 52 | ['es2015', {modules: false}] 53 | ] 54 | } 55 | } 56 | ] 57 | }, 58 | performance: { 59 | hints: false 60 | } 61 | }; 62 | }; 63 | --------------------------------------------------------------------------------