目录结构:

新建webpack.config.js配置文件

const path = require('path') //导出 path是node内置的包 通过npm init初始化得到package.json

module.exports = {  //导出入口和出口路径
entry: './src/main.js', //入口文件
output: { // 动态获取路径
path: path.resolve(__dirname, 'dist'), // resolve拼接路径 __dirname是node自带全局变量,保存现在项目的路径
filename: 'bundle.js'
},
//模块:例如解读CSS,图片如何转换,压缩
module:{ },
//插件,用于生产模版和各项功能
plugins:[ ],
//配置webpack开发服务功能
devServer:{ }
}

npm init初始化得到package.json依赖项文件

{
"name": "meetwebpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack" //打包命令映射 npm run build 执行的是webpack命令
},
"author": "",
"license": "ISC"
}

打包命令:

npm run build

webpack.config.js配置入口出口文件的更多相关文章

  1. webpack(4)webpack.config.js配置和package.json配置

    前言 上一篇文章我们使用webpack打包成功了,但是每次都要自己手动输入打包的文件地址和打包到哪里去的地址,非常麻烦,所以这里介绍使用配置文件进行打包 webpack.config.js 首先我们创 ...

  2. webpack webpack.config.js配置

    安装指定版本的webpack npm install webpack@3.6 -g 安装live-server    运行项目插件   输入live-server  运行后自动打开网页 npm ins ...

  3. webpack.config.js配置遇到Error: Cannot find module '@babel/core'&&Cannot find module '@babel/plugin-transform-react-jsx' 问题

    下文是网上找到的方法,是因为版本冲突的原因,参照后安装7版本解决 cnpm install -D babel-loader@ babel-core babel-preset-env 一. 问题描述 在 ...

  4. webpack.config.js====配置babel

    参考:https://www.jianshu.com/p/9808f550c6a91. 安装依赖babel-loader: 负责 es6 语法转化babel-preset-env: 包含 es6.7 ...

  5. webpack.config.js配置信息的说明

    module.exports = { entry: "./src/main.js", output: { filename: "build/build.js" ...

  6. webpack.config.js====引入Jquery库文件

    1. 安装 cnpm install --save jquery expose-loader 2. 在webpack.config.js中配置 Jquery库是使用的webpack的一个插件Provi ...

  7. vue-cli的webpack模版,相关配置文件dev-server.js与webpack.config.js配置解析

    1.下载vue-cli npm install vue-cli -g vue-cli的使用与详细介绍,可以到github上获取https://github.com/vuejs/vue-cli 2.安装 ...

  8. webpack.config.js====entry入口文件的配置

    1.  一般是采用对象语法: entry: { index: './src/default/js/index.js' }, https://webpack.css88.com/concepts/ent ...

  9. webpack.config.js配置实例

    const path = require('path') const HtmlWebPackPlugin = require('html-webpack-plugin') // 导入 在内存中自动生成 ...

随机推荐

  1. lnmp环境下 tp3.2 not found

    最近将一个lamp环境下使用tp3.2 开发的项目迁移到本地了, 但是在打开项目的时候,提示 not found,经过多方面查找发现是伪静态问题,解决方法如下: 在nginx 域名配置文件我这里是[v ...

  2. Java常用工具——java多线程

    一.线程的创建 方式一:继承Thread类,重写run()方法 package com.imooc.thread1; class MyThread extends Thread{ public MyT ...

  3. SEC7 - MySQL 查询语句--------------进阶3:排序查询

    # 进阶3:排序查询 /* 引入: select * from employees; 语法: select 查询列表 from 表 [where 筛选条件] order by 排序的列表 asc/de ...

  4. Git006--管理修改

    Git--管理修改 本文来自于:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/ ...

  5. Python几行代码实现邮件发送

    话不多说直接进入正题 首先我们需要安装一个名为'zmail'的包,终端执行'pip install zmail'即可实现安装. 直接上代码 import zmail mail = { 'subject ...

  6. 面向JVM的应用程序的项目结构

    对于Maven所用的项目结构,称为Maven标准的目录结构,不包含git 一.一个典型的源代码结构: / [project-name] README.txt LICENSE.txt pom.xml / ...

  7. 炫酷CSS3加载动画

    <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8&qu ...

  8. android测试开发概念

    一:测试分类 1.分类概览 按测试阶段划分: 单元测试 集成测试 系统测试 验收测试 按是否覆盖源代码: 黑盒测试: 功能测试: 界面测试 逻辑测试 安装测试 应用性测试 兼容性测试 性能测试: 稳定 ...

  9. [已解决]报错: warning: LF will be replaced by CRLF in lib/anime.min.js

    git config --global core.autocrlf false

  10. 报错: no such table:django_session解决方式

    如果出现这个错误 “no such table:django_session” 这个错误跟Session的机制有关, 既然要从Web服务器端来记录用户信息, 那么一定要有存放用户session id对 ...