一、使用http-server

  1.安装http-server

    npm install -g http-server

  2.通过命令进入到dist文件夹

  3.运行http-server

    

  以上在浏览器输入上面地址就可以访问了

二、使用nodejs和express搭建服务器

  使用express可以快速搭建一个完整的网站

  1. 需要先安装nodejs

  2.全局安装express-generator

  npm install express --save -g
  npm install express-generator --save -g

  3. 创建一个 express 项目

    express 项目名字

express express-Test

    进入项目  cd express-Test

    安装依赖  npm i

    启动项目  npm start

  4.打包之后的文件复制到 express-test 中的 public 中

    注意:是打包之后dist里面的文件,不包含 dist 结构,放在express-Test中的public文件夹下面

    

     

  5.启动项目

npm start

    终端出现 node ./bin/www 表示运行成功,

    启动之后浏览器打开localhost:3000就可以访问

   

  6.分析express文件

    1.package.json 文件

    在执行npm start 等价于执行 'node ./bin/www'

    dependencies 中是依赖的包

    在 bin/www 中,首先 var app = require('../app'); 首先加载app.js文件

    

    

    app.js是整个项目的入口文件,加载依赖包,配置中间件,加载路由等,最后在www文件中启动服务

  7.额外操作,在修改js文件的时候,需要重新运行,修改后的js才会生效,可以使用 nodemon 让node.js应用自动重启

    1.全局安装 nodemon

npm install nodemon -g

    2.在项目目录下新建 nodemon.json 文件并添加下面代码   

{
"restartable": "rs",
"ignore": [
".git",
".svn",
"node_modules/**/node_modules"
],
"verbose": true,
"execMap": {
"js": "node --harmony"
},
"watch": [ ],
"env": {
"NODE_ENV": "development"
},
"ext": "js json njk css js "
}

    3.将 package.json 中的 start 修改为 nodemon ./bin/www

  以上就配置完成 nodemon ,相当于热加载

三、使用 nginx 本地服务器运行

  1.下载nginx

    http://nginx.org/en/download.html

  2.下载之后解压目录如下

    

  3.打开html文件夹,删除里面的所有内容,将打包好的dist文件夹里面的内容,全部复制到html文件夹下面

    

  4.打开conf文件夹,找到 nginx.conf 文件

    

  5.启动项目

    双击 nginx.exe

  6.浏览器输入访问地址

    localhost:8088

  

vue打包之后在本地运行,express搭建服务器,nginx 本地服务器运行的更多相关文章

  1. 本地windows下搭建git的本地服务器

    本地windows下搭建git的本地服务器 准备工作: 本地安装java环境,配置环境变量(略) 下载gitblit文件,百度一大堆 开始第一步: 减压gitblit压缩包到某个目录下,比如我在:H: ...

  2. express搭建简易web的服务器

    express搭建简易web的服务器 说到express我们就会想到nodejs,应为它是一款基于nodejs平台的web应用开发框架.既然它是基于nodejs平台的框架那么就得先安装nodejs. ...

  3. nodejs+express搭建小程序后台服务器

    本文使用node.js和express来为小程序搭建服务器.node.js简单说是运行在服务端的javascript:而express是node.js的一个Web应用框架,使用express可以非常简 ...

  4. Vue.js(15)之 json-server搭建模拟的API服务器

    json-server搭建模拟的API服务器 运行命令 npm install json-server -D 全局安装 json-server 项目根目录下创建 mock 文件夹 mock 文件夹下添 ...

  5. Linux线上与本地的httpd搭建【制作本地yum源】

    当前时间 2019-10-24-10:53:12 制作本地yum源 我用的VMware Workstation 系统环境: CentOS 7.5 首先我们先要挂载系统镜像 [root@laopa ~] ...

  6. Node:使用express搭建一个简易的服务器

    ①安装node环境 在node.js官网下载LTS长期支持版本,然后傻瓜式安装 ②查看是否安装成功 打开cmd终端,输入node -v 有版本号,则安装成功.再输入npm -v 有版本号,则npm也安 ...

  7. flask运行环境搭建(nginx+gunicorn)

    系统:CentOS7.2(阿里云ESC) 1.python版本,使用的是默认的python2.7(或者先安装python3) 2.安装nginx,yum install -y nginx 3.安装vi ...

  8. 傻瓜式搭建php+nginx+mysql服务器环境

    1.安装nginx 1.安装yum源 rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0. ...

  9. 搭建https+nginx服务器

    搭建https+nginx的服务器,主要是安装ngnix和使用openssl生成自签证书,并在nginx中配置的过程   一.安装环境 1.安装opnssl(ssl支持) https://www.op ...

随机推荐

  1. C001:打印勾

    程序: #include "stdafx.h" int _tmain(int argc, _TCHAR* argv[]) { printf(" *\n"); p ...

  2. java 将本地文件或网络文件与base64互相转换

    一:将网络文件转为Base64 将文件转为base64 public static String fileToBase64(String url){ int byteread = 0; String ...

  3. Oracle数据库正则表达式

    正则表达式: 无论是在前端还是后台正则表达式都是一个至关重要的知识点,例如判断一个手机号码输入是否正确,如果使用Java.C或者其他语言进行字符串进行判断,也许写几十行代码都不一定能解决,而且漏洞百出 ...

  4. console.info(sum(1, 2, 3, 4)(5)(6));

     function add() {    // 第一次执行时,定义一个数组专门用来存储所有的参数    var _args = [].slice.call(arguments); // 在内部声明一个 ...

  5. jenkins通过API触发构建任务

    添加一个可变参数 配置token 参数用 ${参数名称} 引用 外部调用url地址:ip:port/view/视图名称/job/任务名称/buildWithParameters?token=test& ...

  6. CTF-WeChall-第一天

    2020.09.09 今天来了一个新平台,WeChall,从简单的开始做,才能找到自信--i春秋的题做自闭了

  7. 自然常数e的含义

    e是一个重要的常数,但是它的直观含义却不像 π 那么明了.我们都知道,圆的周长与直径之比是一个常数,这个常数被称为圆周率,记作 π = 3.14159......可是e代表什么呢? e是“指数”(ex ...

  8. 复习 | 重温jQuery和Zepto的API

    jq和zepto很相似有许多共同的api,zepto也出了很多与jq不一样的api,总的来说,两者更相似,但是zepto更轻量一点,正好公司也在用,复习这两个没错 jq中的zepto的事件和ajax我 ...

  9. Spring注解不生效原因总结

    在Spring的注解学习中发现使用(@Resource.@PostConstruct. @PreDestroy)这三个注解时不生效.使用@Resource发生空指针异常,说 明被注解对象没有被成功注入 ...

  10. nginx异步访问mysql

    nginx中有一个模块有这个功能,(以前的文章中扩展,这里叫模块,以后统一叫模块,模块可能准确点,因为扩展是单独的文件,而模块是嵌入到主文件中的),这个模块叫drizzle-nginx-module, ...