node --- 在express中配置使用模板引擎(art-template)

下载依赖:

npm install --save art-template express-art-template

配置:

// app.js
const express = require("express");
const app = express();
app.engine("html", require("express-art-template"));

使用: 例如处理浏览器GET请求 /students/new,读取new.html中得元素,使用模板引擎渲染后,返回给浏览器

// app.js
const express = require("express");
const fs = require("fs");
const app = express();
const router = express.Router();
app.engine("html", require("express-art-template"));
app.use(router);router.get("/students/new",function(req,res) {res.render("new.html",{msg:"Hi art-template"});
})app.listen(3000, function(){console.log("Server running...");
});
// new.html  (注:模板引擎默认会相对views目录下读取文件,即此时目录结构是 views/new.html)
<h1>{{ msg }}</h1>

启动服务器. node app.js
在浏览器输入 http://localhost:3000/student/new
在这里插入图片描述
目录结构:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/250920.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

PAM认证机制

一、PAM简介 Sun公司1995年开发的一种与认证相关的通用框架机制&#xff0c;PAM只关注如何为服务验证用户的API&#xff0c;通过提供一些动态链接库和一套统一的API&#xff0c;将系统提供的服务和该服务的认证方式分开&#xff1b;PAM只是一个框架而已&#xff0c;自身不做认证…

02 JSX学习

使用vite处理jsx vite引入的脚本必须是ESM的 npm init -y yarn add vite package.json 添加vite命令 index.html引入jsxJSX是什么 一种标签语法&#xff0c;在JS基础上进行的语法扩展不是字符串、也不是HTML是描述UI呈现与交互的直观的表现形式JSX被编译后会生成React元素 &am…

使用FreeCookies 控制浏览器cookies及修改http响应内容

FreeCookies 插件安装 1&#xff1a;您的计算机需要已经安装Fiddler &#xff08;如未安装&#xff0c;请至官网下载安装 http://docs.telerik.com/fiddler/configure-fiddler/tasks/configurefiddler&#xff09; 2&#xff1a;进入Fiddler安装目录下的Scripts目录下&#xff…

node --- 使用node连接mysql

1.确保下载了mysql,且mysql处于打开状态. 2.确保下载了node,并成功安装:https://nodejs.org/en/ (小黑窗 node -v 查看) 3.安装node操作mysql的依赖包: # 命令行 npm install --save -mysql# 注:如果没有package.json 建议先使用 npm init -y 初始化正题 // app.js// 1. 引…

03 渲染元素ReactDOM.render

React与ReactDOM是2个不同的库&#xff0c;根节点内的所有内容&#xff08;和DOM更新、渲染相关&#xff09;由ReactDOM来管理一个React应用只有一个根节点用ReactDOM.render将React元素渲染到根节点 ReactDOM.render 参数1 React元素&#xff08;React.createElement(类组件/…

javascript --- 异步按顺序执行

使用promise可以很优雅的封装一个异步函数,使其按指定顺序执行: // 异步读取文件操作 const fs require("fs"); function promiseReadFile(url) {return new Promise(function (resolve, reject) {fs.readFile(url, function(err, data) {if(err) {reject(err);} e…

web提高:负载均衡

1、集群 1、为什么建议在阿里云购买负载均衡 非常便宜&#xff0c;又好用&#xff0c;有稳定&#xff0c;有简单。自己搭建不了负载均衡&#xff0c;因为共有云不支持组播跑不了vrp协议。你不会集群的概念&#xff0c;你还是蒙蒙的。2、为什么使用集群&#xff1f; 1、小规模 …

node --- 一个很好用的包json-server

这个第三方包,可以将json文件暴露出来,用http获取. (data.json如下) 下载依赖: npm install --g json-server查看是否含有json-server json -sever --version启动json-server 参考:https://www.npmjs.com/package/json-server

04 组件与Props

一些概念 组件&#xff1a;视图的片段、内部管理数据集合&#xff08;state&#xff09;外部传入配置结合&#xff08;props&#xff09;包含&#xff1a; 1. 视图标记&#xff08;React的JSX、Vue的template&#xff09;需要经过转换而成为真实的DOM 事件 数据 逻辑&#x…

利用ionic3进行上一行和左一行不动,中间移动的功能

首先在html中的写法是 <ion-header><ion-navbar><ion-title>历史数据</ion-title></ion-navbar></ion-header><ion-content ><div style"display:flex;width:625px;"><div class"head">地区</di…

05 state与setState、单向数据流

声明周期与组件卸载 props配置&#xff1a;使用组件时传入数据state私有数据&#xff1a;组件内部使用的数据 state的使用注意事项 必须使用setState方法来更改state多个setState会合并调用props和state更新数据要谨慎&#xff08;有可能在异步程序中更新&#xff09;setState…

HDU 3342 Legal or Not(拓扑排序)

描述 ACM-DIY is a large QQ group where many excellent acmers get together. It is so harmonious that just like a big family. Every day,many "holy cows" like HH, hh, AC, ZT, lcc, BF, Qinz and so on chat on-line to exchange their ideas. When someone…

jquery --- 阻止表单默认的提交行为,标准化表单的数据

表单如下: // .html <form id"topics_new_form" method"post" action"/topics/new"><div class"form-group"><label for"exampleInputEmail1">选择模块</label><selecet class"form-contr…

javascript --- spa初体验

首先使用express创建一个简单的服务器 创建文件夹 be-project # (确保安装了node,并配置好了环境) 在be-project目录下(命令行执行) npm init -y npm install --save express body-parse npm install --global nodemon// app.js const express require("express");…

vuex复习笔记

npm install vuex --save 进行安装 vuex import Vuex from vuex 新建一个vuex文件夹&#xff08;这个不是必须的&#xff09;&#xff0c;并在文件夹下新建store.js文件&#xff0c;文件中引入我们的vue和vuex。 转载于:https://www.cnblogs.com/jinsuo/p/8508699.html

python学习HTML之CSS(2)

1、边框的属性设置 PS&#xff1a;边框的高度和宽度可以采用百分比&#xff0c;但是高度方向的百分比基本无用&#xff0c;因为基数没定&#xff0c;参考没意义&#xff01;&#xff01; 2、内边距和外边距 3、在右下角添加一个“回顶部”的标签。 <div></div>中的…

06 事件处理函数绑定与事件对象

事件处理函数绑定 DOM事件处理 addEventListener or onclick function(){} 纯小写React元素也采用了类似DOM0标准中的事件属性定义的方法 小驼峰 JSX <button onClick{ this.doSth }></button>直接创建React元素 React.createElement(button,{onClick: { this.…

css -- 两种方法实现流式布局

Bootstrap将屏幕分为4个等级: 1.超小屏幕 (宽度小于768 px), 显示宽度 100%; 2.小屏幕 (宽度在768px ~ 992px), 显示宽度 750px; 3.中等屏幕 (宽度在992px ~ 1200px), 显示宽度 970px; 4.大屏幕 (宽度大于1200px), 显示宽度 1170px. js实现: window.addEventListener("r…

python文件名匹配

待匹配文件&#xff1a;#FY3D_IPMNT_GBAL_L1_20180516_0003_030KM_MS.HDF 干扰文件&#xff1a;#FY3D_IPMNT_GBAL_L1_20180516_0003_030KM_MS_uuu.HDF 1.正则表达式import reif re.findall(FY3D_IPMNT_GBAL_L1_\d_\d_030KM_MS.HDF,fileEvery): fileList.append(os.path.join(in…

【XSY1594】棋盘控制 概率DP

题目描述 给你一个\(n\times m\)的棋盘&#xff0c;每次随机在棋盘上放一个国际象棋中的车&#xff0c;不能和以前放的重叠。每个车可以控制当前行和当前列。当所有行和所有列都被控制时结束游戏。问你结束时期望放了多少个车。 注意&#xff1a;结束的条件是所有行和所有列都被…