使用webpack详细步骤
webpack网址:https://webpack.js.org
1.下载并安装nodejs
2.选择Add to PATH系统自动配置环境变量
3.分别执行命令node -v 和npm来验证nodejs是否安装成功
4.输入命令npm install webpack@3.6.0 -g(全局)和npm install webpack@3.6.0 --save-dev(局部)安装webpack,此时webpack环境就搭建好啦,我们可以使用webpack来对文件进行打包了
5.在根目录下分别创建文件夹src和dist创建文件index.html,然后在src下创建js文件,例如我在src下分别创建了main.js,mathUtil.js和info.js
6.其中mathUtil.js中写入了如下代码并使用commenJs语法对变量进行导出
info.js操作如上
7.main.js用于对以上两个文件中导出的变量进行导入并使用,相关代码如下
8.打开终端输入
cd 01.webpack的使用
webpack ./src/main.js ./dist/bundle
对文件的打包操作完成了
想要使用npm run build来执行打包操作吗?那么我们来进行如下配置叭
1.首先我们需要在根目录下创建名为webpack.config.js(必须这个名字奥)的文件
2.然后在webpack.config.js中进行如下配置
3.因为path中需要获取动态的文件绝对路径,我们就需要在终端中输入npm init进行初始化
然后输入npm install然后就会生成package.json文件了,在这个文件中进行配置
4.这样我们就可以使用npm run build命令就可以进行打包操作啦,完成!
本文地址:https://blog.csdn.net/weixin_50680057/article/details/109243017
下一篇: AngularJS入门之动画