小白小白从不日别的博客

Check for node, npm, and npx这了node的版本要求最低8.x以上版本node --versionnpm --versionnpx --version全局安装gulp-cil命令行npm install --global gulp-cli创建项目初始化gulpmkdir gulpDemo // 创建目录cd gulpDemo // 进入目录npm init // 初始化gulp为...

git和svn的区别：git: 分布式版本控制系统，无中央服务器，工作时每个人的电脑就是一个完整的版本库，且工作时无需联网(版本都在自己的电脑上)。 协同方法：A在自己的电脑上修改了B文件，C也在自己的电脑上修改了B文件，那么此时只需A、C将各自的修改推送给对方即可svn: 集中式版本控制系统，版本库集中放置在中央服务器，工作时因为用的都是自己的电脑，那么首先得从中央服务器得到最新版本，再工作；完成后需要把自己的“活”推送到中央服务器。 集中式版本控制系统，必须...

一、

前提：在项目的根目录下1.通过npminstall初始化项目，安装相关包2.通过npmrunwebpack打包项目，则会对应生成相应的文件效果图：源码：index.jsimport './index.css';//引入图片import img from './img/logo.png';console.log(img);//创建 img 元素const imgEl = document.createElement...

在一定程度上可以减少工作量，提升工作效率不会生成类似于dist的文件夹在修改后也不用再次运行 npm run webpack，而是直接修改后，便可看到相应的效果】前提：在项目的根目录下1.通过npminstall初始化项目，安装相关包2.通过npminstall--save-devwebpack-dev-server@3.11.0安装https://www.webpackjs.com/configuration/dev-server/3.通过npm...

前提：切换到项目的根目录下1.通过npminstall初始化项目，安装项目所需的相关的包2.通过npmrunwebpack打包项目，在此之前为了防止因图片路径导致一些不必要的问题，我们可以在webpack.config.js文件里module里进行如下设置：3.通过npminstall--save-devhtml-withimg-loader@0.1.16安装处理HTML文件中图片的包，安装好后在webpack.config.j...

前提：在项目的根目录下1.首先，通过npminstall初始化项目2.其次，通过npmrunwebpack打包项目，此时会在项目的根目录下生成一个dist文件夹，在dist文件夹里的index.html文件中会自动引入：<linkhref="css/main.css"rel="stylesheet"><scriptsrc="main.js"></script>注意：如果是外部的资源，是...

url-loader可以直接处理css和js里的img，无法直接处理html中的img前提：在项目的根目录下1.通过npminstall命令安装相关包2.通过npminstall--save-devurl-loader@4.1.0安装3.配置url-loaderlimit:3000--小于3k的图片都会转换为base64格式，大于3k的图片不转换为base64格式4.通过npmrunwebpack打包文件效果图：...

一、概述

使用React框架接下来我们构建一个React基础环境,在React中我们需要解决的jsx语法问题安装依赖：npm install -D @babel/preset-reactnpm install -S reactnpm install -S react-dom在配置文件中，我们也需要添加jsx语法的解析{ test: /\.(js|jsx)$/,//一个匹配loaders所处理的文件的拓展名的正则表达式，这里用来匹配js和jsx文件（必须） exclude:

三、webpack的四个核心概念

缩小文件搜索范围Webpack 启动后会从配置的 Entry 出发，解析出文件中的导入语句，再递归的解析。 在遇到导入语句时 Webpack 会做两件事情：根据导入语句去寻找对应的要导入的文件。例如 require('react') 导入语句对应的文件是 ./node_modules/react/react.js，require('./util') 对应的文件是 ./util.js。 根据找到的要导入文件的后缀，使用配置中的 Loader 去处理文件。例如使用 ES6 开发的 JavaScript

特别说明因为sass的环境安装比较复杂，而在我们日后的开发过程中，是不需要这样一个环境的，所以就跳过了安装步骤，那大家可能奇怪如何编译sass，这里我们可以使用其他方式编译sass，例如：考拉软件、构建工具和编辑器都可以做到。如果大家还是希望安装一个sass环境，可以参考官网(opens new window)使用变量：sass让人们受益的一个重要特性就是它为css引入了变量 可以把反复使用的css属性值 定义成变量，然后通过变量名来引用它们，而无需重复书写这一属性值 或者，对于仅使

变量（Variables）基本使用方式：@width: 10px;@height: @width + 10px;#header { width: @width; height: @height;}编译为：#header { width: 10px; height: 20px;}混合（Mixins）混合（Mixin）是一种将一组属性从一个规则集包含（或混入）到另一个规则集的方法。假设我们定义了一个类（class）如下：.bordered.