webpack + pug 传递变量， 大神请解惑

最新推荐文章于 2024-03-28 15:03:30 发布
最新推荐文章于 2024-03-28 15:03:30 发布
阅读量557 收藏
点赞数
文章标签： webpack javascript ViewUI
原文链接：https://juejin.im/post/5b4338b55188251afe7b70c4
版权

如题， 本菜想改造下mpvue的脚手架， template模板想使用pug . css 使用 stylus。由于小程序限制包大小， 图片计划开发环境本地一份，生产环境 服务器一份。stylus已经根据环境变量定义上了图片地址变量   且使用正常。  问题是pug变量试了好久就是定义不上。求大神解惑！


如题： 变量是undefined

求教大神 这个要怎么传递变量。 卡在这里好多天了！


weixin_33704591
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue中使用pug语法调用函数传参 mixin
做一个有知识的流氓
09-07 428
👌那么好, 现在不满足咱们的使用需求, 得在原来的基础上做拓展。这是使用方法 使用方式很巧妙哦!在这个里面 调用函数 只做了简单的介绍。
搭建Vue2+Vuex+Webpack+Pug(jade)+Stylus环境
a560694091的博客
07-28 182
一、开发环境配置 开始之前，假设你已经安装了最新版本的 node 和 npm。 全局安装 vue-cli 和 webpack : npm install vue-cli webpack -g 创建工程；工程名字不能用中文，英文也建议小写。 vue init webpack 项目名 按照步骤一步一步执行，需要你添加Project name，Pro...
js pug 代码_javascript – 如何将Node.js变量传递到Pug脚本标记的内部？
weixin_31496135的博客
02-26 331
我试图从Node.js中将一个变量发送到我的Pug页面并将其放在一个pug脚本标记内的javascript变量中. (抱歉,如果这令人困惑)我的node.js代码如下：app.get('/profile', function (req, res) {var session = req.session;res.render('./login.pug', { username: session.uni...
pug模板引擎(原jade)
最新发布
xhw79的专栏
03-28 488
值得注意的是，因为这里的 foot 块 没有 被重定义，所以会依然输出“一些页脚的内容”Pug原名不叫Pug，是大名鼎鼎的jade，后来由于商标的原因，改为Pug，哈巴狗。丑话说在前面，Pug有它本身的缺点——可移植性差，调试困难，性能并不出色，但使用它可以加快开发效率。在后期维护和修改时，一不小心少了一个尖括号，或者某个标签的开始和闭合没有对应上，就会导致DOM结构的混乱甚至是错误。Pug 的条件判断的一般形式的括号是可选的，所以可以省略掉开头的 -，效果完全相同。这是最简单的向模板添加纯文本的方法。
webpack配置
热门推荐
m0_60505147的博客
10-09 1万+
webpack是前端的打包工具打包的工作内容是什么扫描项目，生成整个项目所有模块的依赖关系，根据配置对模块进行合并，生成一个单独的文件。修改html文件，让html文件引用生成后的文件将浏览器无法直接识别的（less、sass、ts）文件，转换成浏览器可以实现的内容。将浏览器暂时无法支持的JS新的语法转换成浏览器可以支持的语法。
webpack-template-pug:Webpack +哈巴狗
05-13
cd webpack-template-pug # Install dependencies: npm install # Server with hot reload at http://localhost:8081/ npm run dev # Output will be at dist/ folder npm run build 项目结构： sr
resume:凯·高翔（Kay Gosho）的简历。 使用Webpack + Pug + PostCSS构建
04-29
使用Webpack + Pug + Postcss构建的Kazuya Gosho的简历。 我们可以使用Netlify轻松创建静态网站。 谢谢！！ 为什么创建此存储库： : 入门 签出仓库后，运行： yarn install yarn start 打开 ，您可以看到我的...
vue3+webpack+vue-router封装路由
05-21
vue3+webpack+vue-router封装路由，资源内容包含了vue3+webpack+vue-router，并且代码对vue-router路由进行了封装，资源下载下来之后项目代码需要先：npm install，之后就可以运行启动项目了，代码结构清晰，没有...
手把手搭建h5框架,webpack+jq 与webpack +vue
11-21
手把手搭建h5框架,webpack+jq 与webpack +vue。 1.初始化一个npm项目 2.安装pnpm 3.安装webpack webpack-cli 4.新建webpack.config.js配置文件 5.安装babel 详细安装方式，手把手教程见README.md文档
vue3+webpack+vue-router路由封装+axios封装+vuex封装
05-23
vue3+webpack+vue-router路由封装+axios封装+vuex封装，下载资源中包括了vue3+webpack+vue-router路由封装+axios封装+vuex封装的相关代码，分别对vue-router路由进行了封装，对axios进行了封装，对vuex进行了封装，...
webpack系列之loader
04-04
webpack系列之loader及简单的使用,里面对loader的基本概念及简单使用做了介绍
webpack4-pug-sass-example：在webpack4中使用pug和sass的示例配置
02-05
webpack4-pug-sass-example 只需克隆项目并运行： npm i && npm run手表 基本文件树： src 剧本 样式
webpack-config:基本的Webpack配置（支持Pug，SCSS，JS，TS，SVG）
05-08
Web项目的初始Webpack 5配置 功能清单 实时服务器 帕格-> HTML SCSS-> CSS（+自动前缀等） 通过Babel支持ES6 + 打字稿支持 流动资产 建立SVG精灵（2个版本） airbnb linter（两者-都适用于JS和TS）； 如何使用 跑步 要运行构建，请使用： npm start 要以生产模式运行，请使用： npm run build CSS /图/其他资产 您无需在js文件中包含任何CSS文件/图像/资产。 样式和图像在这里与js代码完全分开，您可以简单地使用then，就好像没有webpack一样（尽管所有webpack都支持）。 精灵 如果您使用带有多种颜色的svg图标，请将其放置在src/assets/icons-colored文件夹中。 如果您使用单一颜色的svg图标（并打算稍后在css中使用fill src/assets/icons
Webpack 3.x 尝试使用Pug(Jade)模板引擎
Stan的专栏
11-25 3489
关于Pug模板引擎，之前的名字叫Jade，关于它的介绍：可以参考这里，它是一个Pug – robust, elegant, feature rich template engine for Node.js。这里还有一个关于JS模板引擎的常用的几个：JS template engines。先安装:npm i -D pug pug-html-loader安装完成后，它的当前最新版本是："pug-html
webpack学习之路-----使用 pug (jade) 作为 HTML 的模板
ferrysoul的博客
08-13 3317
  index.pug doctype html html(lang="en") head title= pageTitle script(type='text/javascript'). if (foo) bar(1 + 5) body h1 Pug - node template engine #root #contain...
Pug学习笔记
SuperXuyuey的博客
10-04 9771
pug学习笔记 语法
Webpack+express+pug+sass+js 多页面网站打包配置
Z_ammo的博客
12-03 680
本人萌新一枚，最近在做一个私人的多页面网站，本来用的是pug+sass+原生js的技术栈，忽然想试试能否沾一下webpack的优势，利用es6的语法。网上查了很多经验帖，最后总结出如下的方案。 首先备份一下pack.json { "name": "expressapp", "version": "0.0.0", "private": true, "scripts": ...
vue+webpack添加对pug的支持
weixin_30321449的博客
12-12 185
// 安装pug和加载器 yarn add pug-loader pug-plain-loader pug --dev 　　 // webpack.config.js中 添加规则 { test: /\.pug$/, use: ['pug-plain-loader'] } 　 使用　 <template lang="...
使用pug(jade),以及在vue+webpack中使用pug(jade)
xiaozhen0610的博客
07-18 408
一：在HTML中使用pug 在css中有预处理器less和scss来使我们的样式表更加的简介，那么在HTML中有没有这样的格式呢，答案是有的，那就是pug(前身是jade),效果如下： 转译以后 好，看步骤： 第一步：安装pug: #安装支持pug依赖 npm install -g pug pug-loader pug-filters pug-cli 　　这个地方务必使用全局安装，否则会出现“'pug' 不是内部或外部命令，也不是可运行的程序“ 第二步：了解pug的语法： 具体大家可以去看一下这个官
vue3+webpack+cesium
04-03
As an AI language model, I can provide a general overview of Vue3, webpack, and Cesium. Vue3 is the latest version of the popular JavaScript framework, Vue.js. It is a progressive framework for ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值