• 利用node、express初始化项目


      前端做整站是开发,例如:前端是用了vue创建初始化项目,后端我们不会php、java等,我们只能用node去创建去做后端代码,本文就给大家讲解最基础的从零开始创建一个项目的后端环境。

      一般来说前后端代码肯定是分离的,但是也有不分离的情况例如jsp代码,本文讲解前后端分离的情况。

    前后端项目分离,这样后端的项目创建就不需要在前端的代码里,相当于是两个独立的工程。

    一:首先全局安装Node的express 框架

    当然安装过的就不需要在执行这个步骤了。

    cnpm i -g express-generator

    安装完之后通过

    express --version

     

    来查看版本,注意这里只能提供这种方式去查看版本号不能通过 -v 查看版本号。

     

    2、进入我们的后端项目文件夹生成一个默认的后端 node wxpress项目

    express server

    3、这时候目录下面会默认生成一个sever 的目录,进入目录,然后执行

    npm install

    4如何启动项目呢,其实可以看 package.json

     

    控制台执行

     node ./bin/www

    在浏览器 执行

     localhost:3000

     

    一般来说 Node 的项目的端口号都是 3000

    起来之后看到这个就代表好了

     

    项目起来之后

    后端项目一般都是用的是 jade 的引擎去写的,如果不舒服可以换成 html 的,

    首先先安装 ejs

     cnpm i ejs —save

    然后修改app.js,新增

    var ejs = require('ejs’);
    
    app.engine('.html',ejs.__express);

    修改

    app.set('view engine', ‘jade’);
    
    app.set('view engine', 'html');

    这样就可在 views 下面新建 html 的页面了,每次做完修改都需要重新启动 

    Node ./bin/www

     

    other、这里介绍另一种启动方式

     

    1、利用 pm2 启动,首先在 node 的项目按照 

    cnpm install pm2 --save

    2、安装完之后进入项目根目录

    执行

    pm2 start bin/www

    这个是进程式的管理,并且这种方法启动项目后,控制台还可以继续做其他的操作。

    3、关闭项目

    // 关闭的话,关闭所有
    pm2 stop all
    // 关闭某一个
    pm2 stop bin/www 跟启动的方法相对应

     

    前后端不分离项目

      如果我们想吧这个项目放到 例如 vue-cli 构建的项目中,直接在 项目根目录下去创建项目就行,让 server 文件夹和 sec build 在一个目录下就可以

    合并的话,只需要吧 server 里面的 package.json 文件里面的

    "dependencies": {
        "body-parser": "~1.18.2",
        "cookie-parser": "~1.4.3",
        "debug": "~2.6.9",
        "ejs": "^2.5.7",
        "express": "~4.15.5",
        "jade": "~1.11.0",
        "mongoose": "^4.13.9",
        "morgan": "~1.9.0",
        "serve-favicon": "~2.4.5"
      }

    这些项目依赖复制到 vue 的 package.json里面去就可以了,然后在初始化一下就行。

    启动的话 方法不变,vue的启动还是以前的,server的启动也不变,进入 server > bin 执行 node www 就可以了

     

     

     

     

    项目目录介绍:

     

    bin/www 是项目的启动目录

    public 是放一些静态资源的地方

    routes 是项目的路由

    views 是项目的 页面代码

    app.js 项目的配置

     

     

  • 相关阅读:
    VS2013搭建wxWidgets开发环境
    LinuxSystemProgramming-Syllabus
    Python入门2(Python与C语言语法的不同、Notepad++运行Python代码)
    Python入门1(简介、安装)
    面试题收集---grep和find的区别
    浅拷贝 和深拷贝
    使用 system.io.filesysteminfo 来查找文件。
    使用FileSystemWatcher捕获系统文件状态
    system.io.file创建
    Javascript诞生记 [转载]
  • 原文地址:https://www.cnblogs.com/haonanZhang/p/8214030.html
Copyright © 2020-2023  润新知