webpack 简单使用
webpack 简单使用
webpack是目前前端开发最流行的打包工具之一,今天就一步一步构建
初始化npm工程
npm init 创建npm 工程 根据自己的需求进行配置项目
添加webpack 依赖
npm i webpack –save-dev
安装webpack
安装成功之后,在package.json中在 devDependencies中有 webpack
使用webpack打包 js
创建js文件
- 创建module.js
- 创建app.js
module.js 文件内容
export const log = function(){
// document.write('module.js loaded');
console.log('module.js loaded');
}
app.js
import moduleLog from './module.js';
import './style.css';
moduleLog();
document.write('app.js loaded');
- 创建index.html
<!DOCTYPE html>
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
webpack测试