webpack打包工具:

module.exports:输出
require:引入

require('!style-loader!css-loader!./***.css');静态样式引入

npm install css-loader style-loader:终端下载css样式静态模板

npm install jquery --save-dev:终端下载jqurey引入并使用

服务端环境安装

.通过安装webpack-dev-server模块,可以将项目打包到服务端,并可以指定端口,同时,还可以配置启动命令

命令为:npm install webpack-dev-server --save-dev
使用为:
"start":"webpack-dev-server --entey ./src/js/index.js --output-filename ./dist/main.js",
在终端使用为 npm start就可以打开服务器并且使用
启动后再package.json后中的build中添加“--watch”并在终端后使用npm run build就可以
进行时时更新调用

修改端口在webpack.config.js中添加:
devServer:{
port:8081
}
并在终端从新启动npm start

webpack使用打包的一些心得的更多相关文章

  1. webpack独立打包与缓存处理

    关于 微信公众号:前端呼啦圈(Love-FED) 我的博客:劳卜的博客 知乎专栏:前端呼啦圈 前言 先前写了一篇webpack入门的文章<webpack入门必知必会>,简单介绍了webpa ...

  2. express整合webpack的打包文件dist

    对于我来说,第一次接触前后端整合问题的小白,刚开始是一脸懵逼,这个问题整整坑了我一个晚上加一个早上,现在写出来总结: 前端开发:vue-cli+webpack: 后台开发:nodejs框架expres ...

  3. webpack 基本打包方法

    webpack的打包基本配置文件webpack.config.js 可以在webpack.config.js里面写好配置:比如前章节所总结的四大核心 |-- add.js // 定义一个普通加法函数 ...

  4. webpack 单独打包指定JS文件(CopyWebpackPlugin)

    背景: 不确定打出的前端包所访问的后端IP,需要对项目中IP配置文件单独拿出来,方便运维部署的时候对IP做修改.因此,需要用webpack单独打包指定文件.npm install --save-dev ...

  5. webpack项目打包配置

    webpack.config.js 文件中,其中“plugins”最为重要 var path = require("path"); const webpack = require( ...

  6. webpack 安装,打包使用

      Webpack 本身只能处理 JavaScript 模块,如果要处理其他类型的文件,就需要使用 loader 进行转换. 全局安装webpack 打开文件夹amd输入指令  npm i webpa ...

  7. webpack快速入门——实战技巧:watch的正确使用方法,webpack自动打包

    随着项目大了,后端与前端联调,我们不需要每一次都去打包,这样特别麻烦,我们希望的场景是,每次按保存键,webpack自动为我们打包,这个工具就是watch! 因为watch是webpack自带的插件, ...

  8. [Vuejs] webpack+vue-cli打包如何引用相对路径

    默认情况下通过webpack+vuec-li打包的css.js等资源,路径都是绝对的,即static在根目录下,假如部署到带有文件夹目录的项目中,资源路径就会出错,如何解决. 1.修改资源引用相对路径 ...

  9. Vue.js中用webpack合并打包多个组件并实现按需加载

    对于现在前端插件的频繁更新,所以多多少少要对组件化有点了解,下面这篇文章主要给大家介绍了在Vue.js中用webpack合并打包多个组件并实现按需加载的相关资料,需要的朋友可以参考下.   前言 随着 ...

随机推荐

  1. 一步一步pwn路由器之路由器环境修复&&rop技术分析

    前言 本文由 本人 首发于 先知安全技术社区: https://xianzhi.aliyun.com/forum/user/5274 拿到路由器的固件后,第一时间肯定是去运行目标程序,一般是web服务 ...

  2. 131.005 Unsupervised Learning - Cluster | 非监督学习 - 聚类

    @(131 - Machine Learning | 机器学习) 零. Goal How Unsupervised Learning fills in that model gap from the ...

  3. c# 设计模式 之:工厂模式之---工厂模式

    1.uml类图: 实现和依赖关系: 实现: SportFactory.JeepFactory.HatchbackFactory 实现 IFactory 接口 SportCar.JeepCar.Hatc ...

  4. 1 年经验 Java 求职面试题

    从 17 年的大三暑假就在这家公司实习转正,在这家公司呆了快2年了,随着公司新一轮的融资,看起来公司离上市更近了一步,但期权池也进一步稀释,没有期权的我感觉回报更少了,另外在这家公司接触到的东西也有瓶 ...

  5. 利用.NET Core类库System.Reflection.DispatchProxy实现简易Aop

    背景 Aop即是面向切面编程,众多Aop框架里Castle是最为人所知的,另外还有死去的Spring.NET,当然,.NET Core社区新秀AspectCore在性能与功能上都非常优秀,已经逐渐被社 ...

  6. 【转】outlook 2016 配置自动发现

    今天一部门经理换了高大上的终端,办公软件安装的是office 2016,在配置outlook的时候,懵逼了,没有exchange 选项,使用自动发现配置的时候,电脑没有加域,各种尝试,一直过不去,哎, ...

  7. 火狐浏览器对svg支持的一点不足

    项目中要用svg实现一个如下图所示的风机扇叶转动效果 当用chrome浏览器打开,动画显示正常.用火狐浏览器打开扇叶静止不动,代码如下: <svg xmlns:cge="http:// ...

  8. UpdatePanel中用后台CS代码调用JS代码,先执行控件事件,后触发JS

    引用地址: http://www.cnblogs.com/silenkee/articles/1609831.html   页面中加入了UpdatePanel后,Response.Write(&quo ...

  9. codeforces 812E Sagheer and Apple Tree(思维、nim博弈)

    codeforces 812E Sagheer and Apple Tree 题意 一棵带点权有根树,保证所有叶子节点到根的距离同奇偶. 每次可以选择一个点,把它的点权删除x,它的某个儿子的点权增加x ...

  10. Centos7中yum安装MySQL

    安装mysql [root@localhost ~]# yum update [root@localhost ~]# cat /etc/redhat-release CentOS Linux rele ...