5 小时前 / Mr劳卜
（点击上方公众号，可快速关注） 文/劳卜 阅读本文需要3.1分钟这是劳卜的第32篇原创文章 前言 上篇文章：如何架构一个中后台项目的前端部分（技术选型篇） 当我们的前端项目完成了技术选型阶段后，接下来所要做的便是项目的构建和配置。 虽然说用脚手架能够帮助我们完成基本的目录构建和一些基础配置，但是其他很多实用的功能及特殊配置都需要自己动手实践，根据实际场景进行针对性的设置。 本文主要介绍下项目使用 Vue CLI 3.x 构建后，如何正确的配置 webpack。 webpack 配置 首先你需要知道的是，Vue CLI 3 的 vue-cli-service......
17 天前 / 噶牛爱尚
首发于最美前端写文章解读源码系列——create-react-app吴战磊曹操出行 资深前端工程师15 人赞同了该文章create-react-app 是一款优秀的react app脚手架，我花了一些时间把源码做了一个梳理和解读，用注释的方式把主线做了一个引导，大家可以一起学习下： github项目地址：https://github.com/mutong772817723/single-app-cli 该项目已经发布到npm上面，可以用于构建单页面应用 //安装single-app-clinpm install single-app-cli -g//创建一个单页面应用single-app-cli 这期解读了createapp的整个过程，下拉git模板项目的过程这期没有，后续会继......
31 天前 / 柴方博Felbry
如今的前端开发，有可能会面对复杂的环境，所以工程化思维几乎是专业前端工程师必备的。让同一套代码，在不同的环境中运行时，如何让它以最优的方式（尽可能小、尽可能快）加载和执行，是我们需要考虑的问题。 假设我们需要在开发环境中输出额外的调试信息，而在线上环境中不输出，我们可以定义环境变量： // env.js exportconstisDEV=true; import{isDEV}from'./env.js'; if(isDEV){ console.log('...some information...'); } 在发布上线的时候，我们将isDEV的值设置为false。 注意，如果你使用预处理器，比如webpack等打包器，或者......
120 天前 / 滴滴技术
桔妹导读：随着前端技术的发展，Web 应用变得复杂。为解决开发的复杂度，前端开发也有了模块化的概念。使用 Webpack 完成 模块化的打包构建的方案，可谓尽人皆知。但是利用 Webpack 能做的事情远不止如此。这篇文章从一个独特的角度，利用 Webpack 的特点实现了定制化需求，希望能够对大家有一些启发。 ▍背景 有这样的需求：项目交付的给客户时，需要支持针对客户定制产品的 LOGO、登录界面的背景。 ▍简单分析 手动替换图片文件再编译的方法肯定是无法接受的。 如果你说采用分支的方式来实现这种需求，我觉得也是不太现......
136 天前 / u528472
准备开发环境- 安装node - 安装webpack - npm init 初始化项目目录结构 先跑一个小demo// src/index.js import _ from 'lodash' function create_div_element () { const div_element = document.createElement('div') div_element.innerHTML = _.join(['kobe', 'cpul'], ' ') return div_element} const div_ele = create_div_element()document.body.appendChild(div_ele) // dist/index.html