web前端：window启动webpack打包的三种方法

作者:斩月飞仙 更新于： 2020-03-10 22:31:53

　　window是一个英语单词，其意思是:一，窗，窗户;(商店)橱窗;二，窗玻璃;三，电脑窗口，视见区;四气大气窗;五，(信封上的)透明纸窗TC函数名window定义活动文本模式窗口Javascript中的window对象表示浏览器中打开的窗口。

　　window启动webpack打包的三种方法

　　1.在cmd终端执行npxwebpack命令

　　2.在package.json文件同级建立webpack.config.js文件，内容如下：

　　constpath=require('path');

　　module.exports={

　　entry:'./src/index.js',//入口

　　output:{//出口

　　filename:'bundle.js',//文件名

　　path:path.resolve(__dirname,'dist')//生成路径

　　}

　　};

　　执行命令npxwebpack--configwebpack.config.js

　　3.修改package.json脚本

　　{

　　"name":"webpack-demo",

　　"version":"1.0.0",

　　"description":"",

　　"main":"index.js",

　　"scripts":{

　　"test":"echo\\"Error:notestspecified\\"&&exit1",

　　+"build":"webpack"//修改命令执行方法

　　},

　　"keywords":[],

　　"author":"",

　　"license":"ISC",

　　"devDependencies":{

　　"webpack":"^4.0.1",

　　"webpack-cli":"^2.0.9",

　　"lodash":"^4.17.5"

　　}

　　}

　　执行命令npmrunbuild

　　结论：生成类似下面的目录，打开index.html有Hellowebpack显示

　　webpack-demo

　　|-package.json

　　|-webpack.config.js

　　|-/dist

　　|-bundle.js

　　|-index.html

　　|-/src

　　|-index.js

　　|-/node_modules

　　Window对象表示一个浏览器窗口或一个框架。在客户端JavaScript中，Window对象是全局对象，所有的表达式都在当前的环境中计算。也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。例如，可以只写document，而不必写window.document。