Source Address: Https://github.com/qmdx00/Snake, please do not skimp on star.
First draw the UML class diagram:
Create the project structure with ES6 syntax:
Configuration webpack:
Const PATH = require (' path ') Const Htmlwebpackplugin= Require (' Html-webpack-plugin ') Module.exports={entry:'./src/index.js ', Output: {path:path.resolve (__dirname,' Dist '), FileName:' Bundle.js '}, module: {rules: [{test:/\.js?$/, exclude:/node_modules/, Loader:' Babel-loader '}]}, plugins: [Newhtmlwebpackplugin ({Template:'./index.html '})], Devserver: {contentBase:path.join (__dirname,'./release '), open:true, Port:4000 }}
The portal file is index.js and the build directory is dist
To configure the startup script: Package.json
{ "Name": "Snake", "Version": "1.0.0", "description": "", "Main": "Index.js", "Scripts": { "Dev": "Webpack-dev-server--config/webpack.dev.config.js--mode Development", "Build": "Webpack--config/webpack.dev.config.js--mode Production" }, "Author": "Yuanweimin", "License": "ISC", "Devdependencies": { "Babel-core": "^6.26.3", "Babel-loader": "^7.1.5", "Babel-polyfill": "^6.26.0", "babel-preset-es2015": "^6.24.1", "Babel-preset-latest": "^6.24.1", "Html-webpack-plugin": "^3.2.0", "Webpack": "^4.16.5", "Webpack-cli": "^3.1.0", "Webpack-dev-server": "^3.1.5" }}
Perform NPM run build after installation dependency
The final code can be generated. See GitHub for specific code, like for a star oh.
JavaScript Implements Snake games