Git+webpack Project Initialization

Directory structure

• SRC +
  • Page
  • View
  • Image
  • Service
  • Util

Git initialization

• Linux Common commands

  • RM-RF mmall-fe/Delete
  • mkdir Mmall-fe Creating a folder
  • Ls-al Show All Files
  • Cd.. Back to previous level
  • Cat text.html Viewing file contents
  • RM-RF dist/Delete folder (All contents)
  • RM text.html Deleting files
  • Touch Test.json Create a Test.txt file
  • Ls-b Display file list
  • Vim index.html Create and edit
  • : Wq exit Edit State and save

• Local Warehouse and Remote Association

  • Git init git initialization, generating. git files

    • If no SSH is generated SSH key CD ~/.SSH switch to generate key directory LS to see if there is an IDRSA, IDrsa.pub file If there is no need to manually generate. Ssh-keygen generate SSH key cat id_rsa.pub view public key login to GitHub. Open setting->ssh keys and click on the upper right corner of New SSH key to fill in the public key

  • git remote add origin [email protected] corresponds to the origin folder and the remote folder

  • Git pulls origin master pull substitution code (master branch)
  • Git Status View status (no new empty folder, Git only tracks files and file parent directory)
  • git Add. Document Tracking
  • Git commit-am ' xxxx ' submit to local version (-am submit all, and add comments)
  • Git push commits to the remote server
  • git push--set-upstream origin master sets the remote corresponding branch of the current branch
  • . gitignore file
    /node_modules/
    -/dist/
• Git branch:
  • git checkout < branch name >
  • Git checkout-b mall_v1.0 (toggle branch,-B to create a new branch and toggle)
  • Git branch View all branches (front with * for current branch)

NPM initialization

• NPM Init initializes NPM
• NPM Install dependency Package
• NPM Install < dependency pack >[@ version number]
• NPM Uninstall Offload Dependency Package
• G Global Installation

Webpack installation Configuration

• Webpack installation

  • NPM install webpack-g Global installation
  • npm install webpack @1.15.0--save-dev Project Security Install
  • webpack-v View version--save-dev development AIDS dependency--save business code Dependency package

• Configure webpack.config.js

   
       
        entry:js Portal file Externals: Externally dependent claims output: Target file Resolve: Configuration alias module: Various files, various loader plugins: plug-in  
       

• P>webpack loaders
  • html:html-webpack-plugin/html-loader
  • Js:babel-loader + babel-preset-es2015
  • css:style-loader+css-loader
  • image+font:url-loader

• Common commands

  webpack do not compress packaging
  • webpack-p on-line publishing compressed packaging
  • webpack--watch listening static file changes automatic compilation
  • webpack--config WEBP Ack.config.js configuration
  • webpack [-p] [source file] [destination file]
• Front-end development Server Webpack-dev-server NPM install Webpac K-dev-server--save-dev
  webpack-dev-server/client?http://localhost:8080
  Webpack-dev-server--port 8088-- Inline

Git+webpack Project Initialization