node項目的基本構建流程或者打開一個node項目的流程


注意:此處沒講webpack的配置

1.  確立項目所需要的所有依賴、框架(比如bootstrap,vue,angular等)

2. 在項目的根目錄下創建一個package.json文件,package.json文件是項目的最重要文件之一,下面是我的一個項目中得依賴文件:

{
  "name": "element-starter",
  "description": "A Vue.js project",
  "author": "yi.shyang@ele.me",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --inline --hot --env.dev",
    "build": "rimraf dist && webpack -p --progress --hide-modules"
  },
  "dependencies": {
    "element-ui": "^1.3.1",
    "font-awesome": "^4.7.0",
    "vue": "^2.1.8",
    "echarts": "^3.3.2"
  },
  "engines": {
    "node": ">=6"
  },
  "devDependencies": {
    "autoprefixer": "^6.6.0",
    "axios": "^0.16.1",
    "babel-core": "^6.24.1",
    "babel-loader": "^6.4.0",
    "babel-preset-vue-app": "^1.2.0",
    "css-loader": "^0.27.0",
    "file-loader": "^0.10.1",
    "html-webpack-plugin": "^2.24.1",
    "postcss-loader": "^1.3.3",
    "rimraf": "^2.5.4",
    "style-loader": "^0.13.2",
    "url-loader": "^0.5.8",
    "vue": "^2.3.2",
    "vue-loader": "^11.1.4",
    "vue-router": "^2.5.3",
    "vue-template-compiler": "^2.2.6",
    "webpack": "^2.4.1",
    "webpack-dev-server": "^2.4.2"
  }
}

3.  在命令行工具中使用 npm install   命令進行依賴安裝,(可以使用  cnpm  提高安裝速度)這時你會發現,項目的根目錄下多了一個node_modules文件夾,那里面就是從npm遠程庫里下載的模塊然后“安裝”到你的項目中的。
現在,你就可以在你的項目中應用你依賴的這些modules了。你可以通過require關鍵字來使用他們。

const qs = require('querystring');

4. 接下來就根據你所使用的前端框架進行項目搭建與編寫,

5.  如果你是打開一個現成的項目,首先你需要安裝依賴參考第 3 步,  然后在命令行工具中使用  npm  run 來啟動項目, 如果啟動失敗,就看package.json文件里面的script里面設置的啟動命令,  比如:

 "scripts": {
    "dev": "webpack-dev-server --inline --hot --env.dev",
    "build": "rimraf dist && webpack -p --progress --hide-modules"
  },

上面的項目我就需要使用  npm run dev  啟動


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM