webpack的介绍与使用

lxf2024-04-06 11:00:32

  webpack介绍    webpack是将javascript文件的静态模块打包工具。使用webpack可以让我们进行模块化开发    webpack可以打包javascript文件、css文件、图片、json文件等webpack的安装    使用webpack必须安装node环境,前往node.js官网(https://nodejs.org/en/),下载LTS版本;    下载webpack 3.6.0版本。进入cmd命令行模式,输入命令npm install webpack@3.6.0 -g;    安装完毕后输入命令:webpack -version,判断是否安装成功。如果显示版本号,代表安装成功webpack的使用    在使用webpack时,需要对项目的目录结构进行划分,共分为三部分:dist文件夹、src文件夹与根目录文件夹    dist文件夹主要存放webpack打包js文件之后的文件,用于html文件直接使用    src文件夹存放所有要使用的js文件    根目录中的index.html文件为项目的入口文件,用于调用js文件,并且显示在页面上webpack的介绍与使用

      在编写完成js文件之后,进入终端,输入命令:    webpack http://rank.chinaz.comwww.qdxiaochuan.com/src/main.js http://rank.chinaz.comwww.qdxiaochuan.com/dist/bundle.js,这条命令代表将src文件夹中的main.js文件打包到dist文件夹中的bundle.js文件中    之后只要index.html文件调用bundle.js文件,整个项目便可以直接执行了mathUtils.jsmain.jsindex.html

  webpack的介绍与使用