学习笔记(一)——介绍及入口文件"/>
Webpack学习笔记(一)——介绍及入口文件
介绍
开发模式:仅仅能编译Js中的 Es module语法
生产模式:能编译Js中的 Es module语法,还能压缩JS代码
-
npx
侧重于执行命令的,执行某个模块命令。虽然会自动安装模块,但是重在执行某个命令。 -
npm
侧重于安装或者卸载某个模块的。重在安装,并不具备执行某个模块的功能。 -
npx
非常智能的识别模块,如果模块存在,就使用。如果不存在,就临时下载,用完就删除。 -
使用某个
node
模块的时候,根本不用关心是否安装过了。npx
会给你最满意的答案(没有对应模块就临时下载)。
所以,不使用特殊参数的npx
命令的基本逻辑是:先检查当前项目node_modules/
下,是否存在。不存在的话,就检查全局是否已经安装对应的模块。如果还没有的话,就去仓库里面去下载对应的模块,下载完毕就执行。执行完毕就删除,不留下一丝痕迹!
首先进行项目初始化
npm init -y
然后运行webpack
development模式
npx webpack ./src/main.js --mode=development
production模式
npx webpack ./src/main.js --mode=development
结果:
基础入口文件配置
const path = require("path");*module*.*exports* = {// 入口entry: "./src/main.js", //相对路经// 输出output: {//__dirname代表当前文件的文件夹目录path: path.resolve(__dirname, "dist"), //绝对路径filename: "main.js",},// loadermodule: {rules: [],},// Pluginplugins: {},// 模式mode: "development",};
更多推荐
Webpack学习笔记(一)——介绍及入口文件
发布评论