03webpack--输入webpack--自动打包
如何实现时时跟新我写的代码 此时就需要有一个配置文件了 webpack.config.js这个文件 这个文件是在跟目录下哦
webpack是基于node去构建的 所以你的依法和node还是很相似的哦
在配置文件中需要手动的指定配置文件的入口和出口
wabpack.config.js文件最基本的配置哦 文件在跟目录下哦 // 因为要对路径操作 所以你要引入path这个模块哦 对他进行操作哦
const path=require("path"); //路径模块 // 配置文件 暴露出去哦 // 手动的指定入口和出口
module.exports={
entry:path.join(__dirname,'被打包的文件.js'), //入口文件 使用webpack要打包哪一个文件
output:{ //输出相关的配置
path:path.join(__dirname,'./dist'), //指定打包好的文件会输出到哪一个目录(dist)下去
filename:"bundle.js" //指定打包好的文件的名称叫什么名字
}
} 当你配置好了之后 直接在 E:\vuekaifa\lib\05day-webpack-隔行变色>webpack 输入webpack就行了 它就会自动帮你打包
此时还不行 你每次修改的自动帮我们打包 你还需要写后面的代码 看下一章
src目录下的index.html首页如下
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="../dist/test.js"></script> 引入
</head>
03webpack--输入webpack--自动打包的更多相关文章
- webpack快速入门——实战技巧:watch的正确使用方法,webpack自动打包
随着项目大了,后端与前端联调,我们不需要每一次都去打包,这样特别麻烦,我们希望的场景是,每次按保存键,webpack自动为我们打包,这个工具就是watch! 因为watch是webpack自带的插件, ...
- webpack配置:打包第三方类库、第三方类库抽离、watch自动打包、集中拷贝静态资源
一.打包第三方类库 下面说2种方法: 第一种: 1.引入jQuery,首先安装: npm install --save-dev jquery 2.安装好后,在index.js中引入,用jquery语法 ...
- webpack配置自动打包重新运行npm run dev出现报错
webpack配置自动打包重新运行npm run dev出现报错 运行npm run dev出现如下报错 Listening at http://localhost:8080(node:2328) U ...
- 记webpack下进行普通模块化开发基础配置(自动打包生成html、多入口多页面)
写本记时(2018-06-25)的各版本 "webpack": "^4.6.0" //可直接使用4x以上的开发模式,刷新很快 "webpack-de ...
- Jenkins 实现前端自动打包,自动部署代码及邮件提醒功能
在之前的公司,我们前端使用webpack构建项目,项目构建完成后,我们会使用ftp或linux的一些命令工具上传我们的文件到服务器上,这种方式虽然是可以,但是最近面试的时候,人家会问我前端如何部署项目 ...
- 简单地使用webpack进行打包
之前写的有些零散,现在一步步再重新写.记住: 如果你步骤对,但是始终没成功, 那么请不要烦心, 因为webpack版本4以上, 语义更加严格,命令有一些已经发生改变了,所以并不是你的问题! 一.确保已 ...
- 浅谈Webpack模块打包工具三
Source Map 生产代码与开发代码完全不同,如果需要调试应用的话会非常的麻烦,错误信息无法定位,Soutce Map就会逆向得到源代码, 须在打包之后的代码文件的末尾位置例如添加//# sour ...
- ANT自动打包U3D安卓项目研究笔记
概述 因项目使用Atlassian Stash作为项目源码管理端,且其支持Ant命令自动编译,可使其根据最新的代码自动打包,故产生该研究Ant打包的任务.在此将研究过程及一些相关知识整理记录在此. 本 ...
- xcodebuild和xcrun实现自动打包iOS应用程序
随着苹果手持设备用户的不断增加,ios应用也增长迅速,同时随着iphone被越狱越来越多的app 的渠道也不断增多,为各个渠道打包成了一件费时费力的工作,本文提供一种比较智能的打包方式来减少其带来的各 ...
- C#实现APK自动打包
C#实现APK自动打包 最近做了一个安卓项目,其中有一个自动打包的功能,要把供应商id写入APK后打包. 一.思路 在AndroidMinifest.xml中加入一个标识字段,如下 ...
随机推荐
- 使用 vs code 创建 Django 项目
操作流程: 1.前期准备工作 2.vs code配置Python环境 3.新建 Django 项目 4.vs code 配置 Debug Django 环境 5.浏览器查看效果 1.前期准备工作 安装 ...
- MSSQL注入:显错注入及反弹注入
前言: MSSQL注入攻击是最为复杂的数据库攻击技术,由于该数据库功能十分强大,存储过程以及函数语句十分丰富,这些灵活的语句造就了新颖独特的攻击思路. MSSQL的显错注入操作: 以联合查询为例: 猜 ...
- JUC-1-volatile
什么是volatile关键字 volatile是轻量级同步机制,与synchronized相比,他的开销更小一些,同时安全性也有所降低,在一些特定的场景下使用它可以在完成并发目标的基础上有一 ...
- 你不知道的 flex-shrink 计算规则
对于 flex-shrink 我们都知道它在 flex 布局中控制 flex 盒子空间不足时子元素改如何收缩,平常开发中更多的是使用默认值 1 或者设置 0.那设置其他值的时候会有什么效果呢,不少文章 ...
- for(var i in items) 和 for(var i;i<items.length;i++) 区别
前者循环的是属性,后者循环的才是数组. 若项目中对数组属性进行了扩展,那切记不能使用前者,否则在循环数组时扩展的函数体也会被当做数据返回. var data = { p1:1, p2:"b& ...
- nginx--代理和负载均衡
nginx代理 nginx的代理分为正向代理和反向代理 正向代理指的是,一个位于客户端和原始服务器之间的服务器,为了从原始服务器取得内容,客户端向代理发送一个请求并指定目标(原始服务器),然后代理向原 ...
- js input radio点击事件
html代码: <input type="radio" name="myname" value="1" />1 <inpu ...
- PHP TP框架自定义打印函数P
效果如下,有个灰色背景,也不一定是灰色可以改 代码: //传递数据以易于阅读的样式格式化后输出function p($data){ // 定义样式 $str='<pre style=" ...
- rxjava介绍
Observable 在RxJava1.x中,最熟悉的莫过于Observable这个类了,笔者刚使用RxJava2.x时,创建一个Observable后,顿时是懵逼的.因为我们熟悉的Subscribe ...
- CLRCore(CLR核心机制)
JIT--第一次--标记已--存根--调用--查找存根--执行机器码 C#和CIL的关系: C#和N#都是CIL实现,但是彼此不能互通: C#和N#公开不分满足规范,我们才能互通 CLS就是描述多语言 ...