webpack基础笔记

安装

初始化
npm init -y

安装webpack在上一步初始化的目录中
npm install webpack webpack-cli --save-dev 可以简写成 npm i webpack webpack-cli -D

手动创建 webpack.config.js文件

配置webpack.config.js文件

let path = require('path'); 
module.exports = {
    entry:path.resolve('a.js'), // 入口文件
    output:{               
        filename: 'xxx', // 输出文件名
        path:path.resolve('b.js') // 输出文件路径
    },
    module:{  
        rules:[{
             test:/\.css$/, // 以.css结尾的文件用下面的加载器加载
             use:[{loader:'css-loader'},{loader:'style-loader'}] // 使用的加载器(加载器也需要安装)
        }]
    }

配置package.json

"scripts": {
        "dev": "webpack --mode development"
    },
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 目录第1章 webpack简介 11.1 webpack是什么? 11.2 官网地址 21.3 为什么使用 web...
    lemonzoey阅读 5,688评论 0 1
  • 作者:小 boy (沪江前端开发工程师)本文原创,转载请注明作者及出处。原文地址:https://www.smas...
    iKcamp阅读 7,671评论 0 18
  • 版权声明:本文为博主原创文章,未经博主允许不得转载。 webpack介绍和使用 一、webpack介绍 1、由来 ...
    it筱竹阅读 13,850评论 0 21
  • webpack 介绍 webpack 是什么 为什么引入新的打包工具 webpack 核心思想 webpack 安...
    yxsGert阅读 11,552评论 2 71
  • 在今天,我们比任何时候更需要品牌。由于之前工作的原因,有幸接触了很多的淘宝/天猫服装店家,有的年销售额上千万,也有...
    王守黑阅读 2,817评论 0 0