在终端输入npm -v ，会显示版本号。如果没显示，要先安装node环境 下载地址http://nodejs.cn/

都说Vue2简单上手容易，的确，看了官方文档确实觉得上手很快，除了ES6语法和webpack的配置让你感到陌生，重要的是思路的变换，以前用jq随便拿全局变量和修改dom的锤子不能用了，vue只用关心数据本身，不用再频繁繁琐的操作dom，注册事件、监听事件、

可是我却有强迫症，既然处理 node_modules 文件里才出现的错误，那么我就把 test 规则精确到我自己编写的css文件即可，运行测试一切正常

正常情况下在入口 index.js引入 其他的 文件。导入的时候可以用 $. 导入的时候可以省略后缀

WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言，并将其转换和打包为合适的格式供浏览器使用。在3.0出现后，Webpack还肩负起了优化项目的责任。看了这么久，一定着

　　Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。　　Webpack 可以将多种静态资源 js、css、less 转换成一个静态文件，减少了页面的请求。　　插件在 webp

生成的目录结构如下。build -- webpack相关配置文件，一般情况下不需要自己配置。config -- vue基本配置文件，可配置端口号，打包输出等。node_modules -- 依赖包，也就是运行cnpm install 安装的依赖组件都在这里

import { q } from ‘mymodule‘;

Webpack打包优化并没有什么固定的模式，一般我们常见的就是缓存、多进程、抽离、拆分。优化webpack构建速度的第一步就是知道时间花费在哪里，才可以集中的进行针对性的优化。这边我们用到speed-measure-webpack-plugin插件。从开销

业务的组件代码图片大小，针对大的js可以做js的按需加载等优化操作。在软件这一块，性能往往不是最大的问题，软件不断的迭代过程中，可以不断的提升性能，对于构建而言同样是适用的，所以推荐采用高版本的 webpack 和 node.js。高版本的node.js对

先贴上代码，配上解释，有需要可以稍微参考下，还没进入测试。limit: 1024 * 30, //30KB 以下的文件采用 url-loader

其实和import，require没区别，只是这种方式不能写到css或者html里面，就写成了~ (css /less/ sass没有用于导入相关文件的特殊语法, 所以这里添加的~实际上是为了告诉webpack这里是从根目录开始寻找，而不是相对目录。

现在前端最流行的编辑器无疑是VSCode，但是它默认是无法跳转类似于@/assets/a.js这样的路径的，怎么办？jsconfig.json是VSCode自带的一个配置文件，默认不生成这个文件，需要自己创建。官方文档说的很清楚，尽管是英文文档：。它的原理

const path = require; // 导入path模块 ，由于依赖node，所以必须要有package.json，即创建项目。filename : ‘bundle.js‘, // 出口,// 使用多个loader时。// runtime-com

此时会首先检查参数目标是否为目录，如果是目录，则检查package.json的main字段。经过上述过程，解析到一个绝对路径的文件名，然后会尝试为其加上扩展名，第一个存在的文件作为最终的结果。使用当前路径或配置文件中的context作为相对路径的目录。re

由于一些软件安装跟系统环境相关，故这里查看本文档，需要根据自己的系统环境，选择相对应的系统版本。system：macosreact：16.8.6react-dom：16.8.6webpack：4.36.1. Yarn 通过一组丰富的命令执行包的安装、管理、

对于非静态的文件，如js，当webpack打包时，会被直接打到模块文件中，如main.js，如果修改了，需要再次编译。而对于静态文件，如jpg，svg等，我们不希望webpack去打包，只需要在build完后，直接放到dist下的某个路径下即可，随时可以修

)方法二：import()ES2015 loader规范定义了import()方法，可以在运行时动态地加载ES2015模块。import React, { Suspense, lazy } from 'react';const { default: com

在此之前已经有一篇前端脚手架，听起来玄乎，实际呢？，但这一次的npm包和上一次的不是一个概念，前者只是一个脚本工具，而这个npm包是日常开发中方法和组件的集合, 是一个库。在读本文前，假定你已经对npm包有一定概念，熟悉Babel编译和webpack打包的

现在的 webpack 不再是入门噩梦,过去 webpack 最让人心塞的莫过于配置文件，而 webpack4 诞生随之而来的是无配置 webpack。使用 webpack4，至少只需要安装 webpack 和 webpack cli。所以大家完全可以自己