Project online
1. Project configuration
Create a node project, install express, quickly create a web server through express, package the dist folder produced by vue, and host it as a static resource. The key code is as follows:
const express = require ('express' )
// Create web server
const app = express ()
// Host static resources
app.use (express.static ('./ dist' ))
// Start web server
app.listen (80 , () => {
console.log ( 'web server running at http://127.0.0.1' )
})
Create a new vue_shop_server folder, open it with VScode, then call the terminal and enter:
npm init -y
Initialize a package management configuration file.
Then install express, enter:
npm i express -S
After the installation is complete, copy the dist directory that we generated by packaging to the vue_shop_server directory. And create a new app.js entry file:
Import express first.
const express = require ('express' )
// Create web server
const app = express ()
// Host static resources
app.use (express.static ('./ dist' ))
// Start web server
app.listen (80 , () => {
console.log ( 'web server running at http://127.0.0.1' )
})
In order to test whether the server can run normally, you can enter in the terminal:
node app.js
When the terminal can print "web server running at http://127.0.0.1" normally, it proves that the server started successfully.
Then open the browser and enter http://127.0.0.1
Found that it can be accessed normally.
Note: If there is a problem with the style, just put the element-ui js file in the index.html file at the end, and that's it.
