webpack 使用

参考的文章  ：https://blog.csdn.net/u012443286/article/details/79504289

为了避免出现不必要的麻烦，在使用webpack 的时候要全局安装

 --display-error-details    显示异常信息

--watch  是可以一直监听  有变化就重新打包

-p    压缩混淆脚本，这个非常非常重要！

-d    生成map映射文件，告知哪些模块被最终打包到哪里了

1  npm install -g webpack

2  npm install -g webpack-cli

3  新建入口文件默认  src/index.js 

4  新建出口文件默认dist/main.js

5  在package-json  配置

“dev”: " webpack --mode development ",            // 后面可以加 --watch

"build":" webpack --mode production "

以后直接运行  npm run dev /  npm run build  就可以了

如果是低于版本四  应该配一下 webpack.config.js

首先  webpack.config.js  文件

在里面加入

module.exports = {

       entry: ————dirname + "/src/index.js"    //这里是入口文件

       output:{

                  path:__dirname + '/dist')   //输出目录

                  filename: 'bundle.js' ，     //输出文件

        }

}

在package.json 中

更改main  :webpack.config.js  就可以了

script  中 加入  "start":"webpack"

plugin  : https://www.npmjs.com/package/html-webpack-plugin

css-loader :格式转化   https://www.npmjs.com/package/css-loader    还需装style-loader

style-loader: https://www.npmjs.com/package/style-loader

sass loader: https://www.npmjs.com/package/sass-loader