vue node(express) es uno de los desarrolladores de capa intermedia

La estructura utilizada es un proyecto front-end de Vue, con un servicio de nodo empaquetado internamente

Ejecute npm run dev para iniciar vue

Introduzca iview y axios, y edite el archivo main.js

Editar el archivo helloworld.vue

En este momento, utilice el componente iview y configure dos métodos de llamada de datos.

En este punto, use el componente iview y configure dos métodos para llamar a los datos. La interfaz es la siguiente

Instale npm install -g express-generator@4

.

Cree una nueva carpeta de servidor en vueapp, cambie a la carpeta del servidor, ejecute express node_api amp cd node_api, se creará un nuevo proyecto node_api y luego instalará las dependencias npm;

Ejecutar npm start para iniciar express

Configurar el enrutamiento en la página server/node_api/routes/index.js. js

Utilice un navegador o cartero para acceder a localhost: 3000 (el puerto predeterminado es 3000), puede ver que hay un retorno

Instale nodemon para nodejs hotstart npm install -- save-dev nodemon, use el comando nodemon para hacer referencia al comando de nodo

Instale crossenv para la configuración de variables de entorno npm install --save-dev crossenv, edite server/node_api/package.json:

En este momento, el front-end muestra Ahora, los datos del back-end también están disponibles, pero el problema entre dominios aún debe resolverse, porque un puerto es 8080 y el otro es 3000.

En el archivo express app.js, edite:

Configure el proxy vue y edite config/index.js:

Reinicie express y luego haga clic en En el botón de interfaz, puede ver los datos enviados por el servidor.

Qué se puede hacer a continuación

La pantalla frontal está disponible y los datos de fondo también están disponibles.