node项目的基本构建流程或者打开一个node项目的流程

Posted Facker

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了node项目的基本构建流程或者打开一个node项目的流程相关的知识,希望对你有一定的参考价值。

1.  确立项目所需要的所有依赖、框架(比如bootstrap,vue,angular等)

2. 在项目的根目录下创建一个package.json文件,package.json文件是项目的最重要文件之一,下面是我的一个项目中得依赖文件:

{
  "name": "element-starter",
  "description": "A Vue.js project",
  "author": "[email protected]",
  "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  启动

以上是关于node项目的基本构建流程或者打开一个node项目的流程的主要内容,如果未能解决你的问题,请参考以下文章

前端Node项目发布流程

夺命雷公狗---node.js---19之项目的构建在node+express+mongo的博客项目4mongodb在项目中的基本引入

node快速构建express项目

vue项目的运行流程

夺命雷公狗---node.js---20之项目的构建在node+express+mongo的博客项目5mongodb在项目中实现添加数据

项目部署流程