webpack
发现一只小刺猬
这个作者很懒,什么都没留下…
展开
-
webpack高级概念-TreeShaking,CodeSplitting,Shimming
Tree Shaking 只支持ES module的引入,即import引入方法,作用是把不需要的代码“摇晃”掉,减少打包体积。比如 // math.js export const add = (a, b) => { return a + b; } export const minus = (a, b) => { return a - b; } // index.js import {add} from './math.js' ..... 打包之后可以看到 a原创 2020-11-11 18:12:25 · 582 阅读 · 1 评论 -
使用webpack对react代码进行打包
安装react npm install react react-dom --save index.js添加react代码 import "@babel/polyfill"; import React, {Compnent} from 'react'; import ReactDom from 'react-dom'; class APP extends Component { render() { return <div>Hello World</di.原创 2020-11-11 15:11:01 · 159 阅读 · 0 评论 -
webpack学习打包静态资源,file-loader, url-loader,css-loader
安装webpack npm install webpack webpack-cli -D 执行webpack命令 npx webpack npx命令表示执行项目中node_modules中webpack的命令,否则直接执行webpack,则需要全局安装webpack。全局安装webpack不利于多个项目时,webpack版本不一致,不利于维护。 也可以使用npm script来执行命令。在package.json中,添加 "scripts": { "build": "webpac原创 2020-11-09 18:10:38 · 233 阅读 · 0 评论