- 综合排序
- 最热优先
- 最新优先
- 来自专栏薄荷前端
Vue-cli原理分析
metadata 数据 和 { isNotTest, isTest 合并 } if (opts.metalsmith && typeof opts.metalsmith.before === 'function ') { opts.metalsmith.before(metalsmith, opts, helpers) } // askQuestions是会在终端里询问一些问题 // 名称 === 'function') { opts.metalsmith(metalsmith, opts, helpers) } else if (opts.metalsmith && typeof opts.metalsmith.after === 'function') { opts.metalsmith.after(metalsmith, opts, helpers) } /src` which is Metalsmith's default for `source` .destination(dest) .build((err, files) => {
33110编辑于 2024-02-04 - 来自专栏『学习与分享之旅』
『手撕Vue-CLI』编译模板『上』
编译逻辑 编译逻辑就是将用户输入的信息替换到模板中，这里需要用到 Metalsmith 这个库，这个库的作用就是将用户输入的信息替换到模板中，它就有这个能力。 官网我就不贴出来大家自行去 npm 官网搜索即可，这里直接安装 Metalsmith： npm install metalsmith --save 安装好了之后，导入 Metalsmith： const Metalsmith = require('metalsmith'); 然后在 else 代码块中，编写编译逻辑： // 处理用户输入 await new Promise((resolve, reject (__dirname) 这个方法是用来创建一个 Metalsmith 实例的，这个实例中包含了一些方法，比如 source、destination、use、build 等方法。 因为 Metalsmith 是一个流式处理的库，它是通过 .use 方法来注册插件的，这里我注册了两个插件，第一个插件是用来处理用户输入的，第二个插件是用来处理模板的。
13211编辑于 2024-05-27 - 来自专栏薄荷前端
Vue-cli原理分析
/logger') 复制代码 chalk 是一个可以让终端输出内容变色的模块 Metalsmith是一个静态网站（博客，项目）的生成库 handlerbars 是一个模板编译器，通过template和 metadata 数据 和 { isNotTest, isTest 合并 } if (opts.metalsmith && typeof opts.metalsmith.before === 'function ') { opts.metalsmith.before(metalsmith, opts, helpers) } // askQuestions是会在终端里询问一些问题 // 名称 === 'function') { opts.metalsmith(metalsmith, opts, helpers) } else if (opts.metalsmith && typeof opts.metalsmith.after === 'function') { opts.metalsmith.after(metalsmith, opts, helpers) }
1.1K20发布于 2019-04-03 - 来自专栏grain先森
Vue-cli 原理分析
metadata 数据 和 { isNotTest, isTest 合并 } if(opts.metalsmith &&typeofopts.metalsmith.before ==='function ') { opts.metalsmith.before(metalsmith, opts, helpers) } // askQuestions是会在终端里询问一些问题 // 名称 描述 作者 是要什么构建 ==='function') { opts.metalsmith(metalsmith, opts, helpers) }elseif(opts.metalsmith &&typeofopts.metalsmith.after ==='function') { opts.metalsmith.after(metalsmith, opts, helpers) } // clean方法是设置在写入之前是否删除原先目标目录 默认为 true // source方法是设置原路径 // destination方法就是设置输出的目录 // build方法执行构建 metalsmith.clean(false) .source('.')/
1.4K10发布于 2019-03-29 - 来自专栏开源服务指南
静态网站生成器推荐：构建高性能网站的利器
metalsmith/metalsmith[5] Stars: 7.8k License: MIT Metalsmith 是一个极其简单且可插拔的静态网站生成器。 可扩展性强：使用 Metalsmith 的插件系统，你可以根据需要添加、删除和定制不同的功能模块。 适应多种需求：无论是构建个人博客还是开发复杂项目文档，在 Metalsmith 中都能找到解决方案。 强大而灵活：每个文件都包含元数据，并由插件进行处理。这意味着您可以对任何文件执行几乎任何操作。 github.com/react-static/react-static [4] gridsome/gridsome: https://github.com/gridsome/gridsome [5] metalsmith /metalsmith: https://github.com/metalsmith/metalsmith [6] middleman/middleman: https://github.com/middleman
1.8K20编辑于 2023-08-10 - 来自专栏前后两端不设限
前端脚手架构建实践
commander NodeJs命令行工具，提供了用户命令行输入和参数解析，用户解析用户输入 inquirer NodeJs交互式命令行工具，询问操作者问题，获取用户输入，校验回答的合法性 metalsmith = require('metalsmith'); const Handlebars = require('handlebars'); const path = require('path'); const questionConfig } = JSON.parse(config); const answer = await askQuestion(questionConfig); const metalsmith = Metalsmith(__dirname); metalsmith .metadata(answer) .source(path.join(dirPath, source)) .destination(path.join(dirPath, dist)) .use(function (files, metalsmith, done) { //遍历替换模板
1.3K30编辑于 2022-12-24 - 来自专栏工具客栈
博客平台，自建博客，静态博客生成器搜集
Metalsmith Metalsmith是简单、高效、pluggable静态网站生成工具，它使用nodejs编写。 Metalsmith和其他工具的最大区别是它的所有东西都由插件处理，并且插件可以重用。只要决定网站的功能，然后找到相关插件，组合到一起，ok，ready to go! Metalsmith也可以生成PDF、电子书、文档等等。
91110编辑于 2023-06-26 - 来自专栏黄Java的地盘
如何实现一个脚手架进阶版（Vue-cli v2.9学习篇）
怎么对下载的文件进行处理 当你提供的模板不仅仅是一个纯粹的文件，而是可以通过某些参数进行编译，得到不同的目标文件时，你可以通过metalsmith来对文件进行操作。 在Vue-cli中，使用了模板引擎合并库consolidate.js,通过这个库的render方法来编写metalsmith的处理函数，从而在渲染的过程中对模板进行处理，具体代码如下： exports.handlebars.render
1.3K10发布于 2018-09-18 - 来自专栏网络日志
中秋节最后一天，手撸一个自己的前端脚手架
其实就借助了他~ inquirer ：交互式命令行工具，有他就可以实现命令行的选择功能 download-git-repo ：在git中下载模板 chalk ：粉笔帮我们在控制台中画出各种各样的颜色 metalsmith 核心原理就是将下载的模板文件，依次遍历根据用户填写的信息渲染模板，将渲染好的结果拷贝到执行命令的目录下 安装需要用到的模块 npm i metalsmith ejs consolidate const MetalSmith = require('metalsmith'); // 遍历文件夹 let { render } = require('consolidate').ejs; render = promisify target, path.join(path.resolve(), projectName)); } else { await new Promise((resovle, reject) => { MetalSmith
24510编辑于 2024-07-31 - 来自专栏程序员成长指北
厌倦了写活动页？快来撸一个页面生成器吧！
编译其实也就是通过 metalsmith 静态模板生成器把模板作为输入，数据作为填充，按照 handlebars的语法进行规则渲染。最后产出 build 构建好的目录。 ，以数据入口为生成源，通过renderTemplateFiles编译产出到目标目录 function build(data, temp_dest, source, dest, cb) { let metalsmith = Metalsmith(temp_dest) .use(renderTemplateFiles(data)) .source(source) .destination(dest ) .clean(false) return metalsmith.build((error, files) => { if (error) console.log(error);
1K20发布于 2020-11-23 - 来自专栏C/C++基础
博客生成静态站点工具 Top 20
8.GitBook CLI 9.Docsify 10.VuePress 11.Mkdocs 12.Eleventy 13.Pelican 14.React Static 15.Gridsome 16.Metalsmith 16.Metalsmith star 数 8K+。 Metalsmith 一个基于 Node.js 开发的超级简单、插件化的静态网站生成工具。 Metalsmith 采用模块化的设计，用户可以根据自己的需求和喜好选择不同的插件进行配置，以生成满足自己需求的网站。 你可以查看它的 GitHub和官网了解更多。
5.4K21编辑于 2023-03-10 - 来自专栏源码揭秘
前端工程化-打造企业通用脚手架
主要使用ejs实现模板字符替换 ncp ：像cp -r一样拷贝目录、文件 metalsmith ：可插入的静态网站生成器；例如获取到根据用户自定义的输入或选择配合ejs渲染变量后的最终内容后，通过它做插入修改 focusTemplate中 如果模板项目中没提供ask-for-cli.js文件，则使用ncp直接拷贝代码到本地 ·如果存在则使用inquirer根据用户输入和选择渲染（consolidate.ejs）变量最终通过metalsmith path.join(result, CONFIG.ASK_FOR_CLI as string)); await new Promise<void>((resolve, reject) => { MetalSmith
1K20编辑于 2022-02-14 - 来自专栏cnblogs
中后端管理系统前后分离、前端框架的实现拙见
chalk: 命令窗口文字有颜色的输出 commander：解析命令的输入 download-github-repo：下载github上面的模板项目 fs-extra：file和folder的处理，如删除 metalsmith
1.4K90发布于 2018-01-17 - 来自专栏编程
深入认识 vue-cli：能做的不仅仅是初始化 vue 工程
以这个README.md文件为例，在vue-cli运行的过程中，会首先读取文件的内容放在内存，然后通过 获取用户输入，把输入的值替换到文件内容里面，最后通过另外一个名叫Metalsmith的工具，把替换好的内容输出为文件
1K80发布于 2018-01-10 - 来自专栏前端Q
提高生产力--让项目配置变为自己专属的脚手架
download-git-repo，下载模版 inquirer 命令行交互，获取用户输入 ora 进度条 log-symbols 输出一些标志，如√ handlebars 模板引擎，更复杂或高级点的可以用 metalsmith
64510发布于 2019-12-21 - 来自专栏JowayYoung谈前端
npm依赖(类库工具)
js-pdf: PDF解析 js-xlsx: Excel解析 js-yaml: YAML解析 jslib-base: 项目初始化 madge: 文件依赖关系 markdown-it: Markdown解析 metalsmith
2.9K20发布于 2020-04-01 - 来自专栏IMWeb前端团队
自制前端脚手架
{tplPath}/meta`); const projectPath = `${process.cwd()}/${dir}`; // 生成新项目 Metalsmith
1.6K80发布于 2017-12-29 - 来自专栏IMWeb前端团队
自制前端脚手架
{tplPath}/meta`); const projectPath = `${process.cwd()}/${dir}`; // 生成新项目 Metalsmith
69930发布于 2019-12-03 - 来自专栏进击的全栈
Web渲染那些事儿
Jekyl 和 Metalsmith 提供更多模板驱动的方法，更加符合它们的静态特质。 静态渲染的一个缺点是必须为每个可能的 URL 生成单独的 HTML 文件。
2.3K30发布于 2019-03-03
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号