VUE打包的项目在本地运行

这个是基于nodeJs搭建的一个简易的服务器。所以电脑上要有Node环境和npm环境。 git地址是: clone下来后npm i 一下就好了。

项目结构也很简单,代码就几句。关键是不用在vue.config.js里面配置打包的路径。我自己用的挺好。就记录下来,以防丢失! 我把我的打包好dist文件夹的文件结构也发一下

dist是vue打包好的文件夹。要用的话就创建一个文件夹,初始化,我把package.json、package-lock.json的代码贴出来。你们复制到你们的json文件里面。然后打开命令行直接npm install 下载依赖就好了。 代码贴在下面了。主要是太长了。 等依赖下载完了,就可以打开简易服务器了。前提你已经下载了node,支持npm 在你测试的文件夹打开powershell或者cmd、运行app.js 在命令行内输入 node ./app.js 敲回车,就打开了简易服务器。

可以看到下面提示运行在 http://127.0.0.1:8800下了。打开你的浏览器输入这个地址。就可以预览了。!

如果运行不了把app.js里面的“./dist” 改成你打包好的文件名称!

app.js

const express = require("express");
const app = express();

app.use(express.static("./dist"));

app.listen(8800, () => {
          
   
  console.log("server running at http://127.0.0.1:8800");
});

package.json

{
          
   
  "name": "testProject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
          
   
    "test": "echo "Error: no test specified" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
          
   
    "express": "^4.17.1"
  }
}

package-lock.json

经验分享 程序员 微信小程序 职场和发展