【Vue】06 Webpack Part2 打包命令配置
Webpack 配置:
入口 & 出口:
就是我们使用的打包命令:
一个是对什么文件执行,这就是入口
一个是输出到什么文件,这就是出口
每一次打包使用这个命令都必须指定这两个必要的参数
所以将打包命令写入配置文件中,运行时读取即可
在项目的根目录下创建webpack.config.js

const path = require('path');
module.exports = {
entry : "./src/main.js", // 入口 可以是字符串,数组,对象
output : { // 出口,通常是一个对象 至少包含路径和文件名
path : path.resolve(__dirname, 'dist'),
filename : "bundle.js"
}
}
这一次我们的打包只需要执行webpack即可

我们可以再对package.json设置:
{
"name": "webpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build" : "webpack"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^3.6.0"
}
}
打包时就可以直接使用这个命令:
npm run build
【Vue】06 Webpack Part2 打包命令配置的更多相关文章
- webpack正式、测试环境接口地址本地运行及打包命令配置
声明:本文由w3h5原创,转载请注明出处:<webpack正式.测试环境接口地址本地运行及打包命令配置> https://www.w3h5.com/post/521.html 为了方便开发 ...
- webpack自定义打包命令
更快捷的执行打包任务 1.执行类似于node_modules/.bin/webpack这样的命令其实是比较烦人且容易出错的,不过值得庆幸的是npm可以引导任务执行, 对其进行配置后可以使用简单的npm ...
- vue -- vue-cli webpack项目打包后自动压缩成zip文件
用vue2.0开发项目,使用npm run build 命令 ,但是只会生成dist文件夹,以下是生成zip压缩包方法 1,插件安装 webpack插件安装 filemanager-webpack-p ...
- vue之webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用
问题描述 一般情况下,通过webpack+vue-cli默认打包的css.js等资源,路径都是绝对的 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径 ...
- Vue之webpack的安装与配置及其简单应用
一.文件结构 二.index.html <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- webpack 安装,打包使用
Webpack 本身只能处理 JavaScript 模块,如果要处理其他类型的文件,就需要使用 loader 进行转换. 全局安装webpack 打开文件夹amd输入指令 npm i webpa ...
- vue中利用.env文件存储全局环境变量,以及配置vue启动和打包命令
目录 1,前言 2,.env文件的作用 3,配置.env文件 4,配置启动命令 5,获取.env中的全局变量 5,实际用处 1,前言 分享一下vue项目中利用.env文件存储全局环境变量,以及利于项目 ...
- 规范开发目录 及 webpack多环境打包文件配置
规范开发目录 普通项目 开发目录: ├── project-name ├── README.md ├── .gitignore ├── assets ├── ├── js ├── ├── css ├─ ...
- vue的webpack打包
一个完整的项目离不开 开发环境 生产环境 测试环境 这三个环境 首先解释一下这三个环境的含义 开发环境:开发环境是程序猿们专门用于开发的服务器,配置可以比较随意,为了开发调试方便,一般打开全部错误报告 ...
- vue+vue-cli2+webpack配置资源cdn
vue-cli2+webpack构建的vue项目如何让图片和js等静态资源走cdn,哪里可以配置呢?下面我详细介绍 1.config/index.js中可以看到 module.exports = { ...
随机推荐
- Windows文件管理优化-实用电脑软件(一)
RX文件管理器 (稀奇古怪的小软件,我推荐,你点赞!) 日后更新涉及:电脑.维护.清理.小工具.手机.APP.IOS.从WEB.到到UI.从开发,设计:诚意寻找伙伴(文编类.技术类.思想类)共编,共进 ...
- 关于java的一些吧啦吧啦
今天凌晨在催眠时刻听了一些了java相关,顺便睡觉了 学习了关于电脑中的一些知识,类似cmd之类的快捷指令,比如切换盘符,显示文件夹等等: 还有jdk的版本下载,第一个程序helloworld怎么编写 ...
- 使用shell脚本在Linux中管理Java应用程序
目录 前言 一.目录结构 二.脚本实现 1. 脚本内容 2. 使用说明 2.1 配置脚本 2.2 脚本部署 2.3 操作你的Java应用 总结 前言 在日常开发和运维工作中,管理基于Java的应用程序 ...
- maven项目创建默认目录结构
maven项目创建默认目录结构命令 项目文件夹未创建情况下 mvn \ archetype:generate \ -DgroupId=com.lits.parent \ -DartifactId=my ...
- Django Paginatior分页,页码过多,动态返回页码,页码正常显示
问题: 当返回数据较多,如设置每页展示10条,数据接近200条,返回页码范围1~20,前端每个页码都显示的话,就会出现页码超出当前页面,被遮挡的页码无法操作和显示不美观: 代码优化: 在使用pagin ...
- 【VyOS-开源篇-3】- container for vyos 搭建 Halo 博客-vyos-开源篇
文章说明:介绍在vyos软路由上配置container容器,vyos最新滚动版1.5已经支持在vyos命令行中启动docker容器,在vyos 官网介绍是说1.3版本之后就都有这个功能了,如果你的版本 ...
- Linux设备模型:1、设计思想
背景 搞Linux搞这么久,一直在调试各种各样的驱动.却发现对Linux驱动有太多不够了解的地方.因此转载了 蜗窝科技 的有关文章,作为学习. 内容有少量纠正,样式有做调整. 作者:wowo 发布于: ...
- 全志科技A40i开发板规格书(四核ARM Cortex-A7,主频1.2GHz)
1.评估板简介 创龙科技TLA40i-EVM是一款基于全志科技A40i处理器设计的4核ARM Cortex-A7高性能低功耗国产评估板,每核主频高达1.2GHz,由核心板和评估底板组成. 评估板接口资 ...
- FreeRDP使用,快速找出账户密码不正确的服务器地址
最近有个需求,需要找出服务器未统一设置账户密码的服务器,进行统一设置,一共有一百多台服务器,一个个远程登录看,那得都费劲啊,这时候就可以用到FreeRDP这个远程桌面协议工具,FreeRDP下载,根据 ...
- n阶前缀和 の 拆解
二阶 \[\sum_{i=l}^{r} \sum^{i}_{j=1} a_j \] \[=\sum_{i=l}^{r} (r-i+1) a_i \] \[=(r+1)\sum_{i=l}^{r} a_ ...