打开命令提示符(Windows+R,然后输入cmd)或者win10系统里底部栏输入cmd搜索一下就出来了。webpack开发环境配置前提是你已经是node环境了,可以在命令提示符里输入
node -v
来检查是不是node环境,如果出现相应版本号,那就是node环境了,如果未出现,需要安装node环境,直接去官网下载安装就可以。假定你已经安装了node
一、全局安装webpack
在命令行输入:
npm install -g webpack
-g就是全局安装
二、全局安装webpack-cli
npm install -g webpack-cli
三、创建项目
假定你想在f盘建一个webpack_demo文件,在命令行输入:
f:
按回车键,这里将转到f盘,然后输入:
mkdir webpack_demo
建立webpack_demo文件,然后输入:
cd webpack_demo
进入这个文件,这个文件就是我们的项目文件目录。
四、初始化工程目录
cd webpack_demo
进入这个目录后,在命令行输入:
npm init
输入完成后,npm终端会问你一些关于项目的名称,描述等等,一堆东西,如果你想写写,就写写,不想写的话就一路回车就可以。完成后,我们发现文件夹种增加了package.json文件,它用于保存关于项目的信息。
五、创建入口文件
我们在webpack_demo文件夹下建一个src的文件夹,然后在src文件下建一个index.js文件,即将'./src/index.js'作为入口
我们可以在index.js文件夹下输入一些代码,例如:
function aaa(){
alert("asd")
}
aaa()
然后命令行输入:
webpack --mode development
或者:
webpack --mode production
(这个没试过)
然后可以看到根目录webpack_demo下生成了dist目录,并且在dist目录下生成了main.js文件,main.js文件已经打包了src目录下index.js文件中的代码。
未完待续。。。本人小白,之后学了会继续补充。。