webpack 安装流程

我最近想看看wabpack,然后就面临着安装的问题,说实话,我一点也不懂cmd,怎么还需要用cmd安装呢。其实看教程上说可以在npm上安装,但是我打开npm总是出现闪退,所以我就选择了cmd

安装的过程,首先我们需要下载node.js,因为现在6以上的版本,都包括了npm,连带npm就一起下载了。

下载完之后,我就打开了cmd 首先验证node安装上了吗,代码如下

1)然后

3)上面的安装上了。下面我们就开始运行打包了,

  首先创建一个静态页面 index.html 和一个 JS 入口文件 entry.js

<!-- index.html -->
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="bundle.js"></script>
</body>
</html>

  

// entry.js
document.write(‘It works.‘)

  将这2个文件放在新建的webpack文件中,然后编译 entry.js 并打包到 bundle.js:

4)在cmd中继续输入

webpack entry.js bundle.js

5)打包过程会显示日志:

6)这就成功了,然后在webpack文件里面就可以看到文件bundle.js了。  

 
时间: 2024-10-11 10:54:29

webpack 安装流程的相关文章

node,npm,webpack,vue-cli模块化编程安装流程

首先什么都不要管,先装环境. pip是万能的!!! 安装node: pip3 install node 安装npm:   pip3 install npm 安装webpack: npm install webpack 安装vue-cli: npm install vue-cli 安装vuex: npm install vuex 安装axios: npm install axios 至此,我们需要的东西全部安装好了. 接下来就是创建项目: 创建一个文件夹,然后进到这个文件夹里面: npm init

nodejs,webpack安装以及初步运用

nodejs安装: 1.下载:https://nodejs.org/en/download/ 2.安装node-v6.11.3-x64.msi文件,直接默认安装(next--): 3.验证是否完成安装:cmd 进入后输入命令 node -v  回车能得到nodejs版本号: 输入node 回车再输入console.log('aaaaa') 回车能正常显示输出. 这表示nodejs安装成功. webpack安装: 1.npm安装:在f盘新建文件夹webpack,在webpack文件夹建文件夹dem

最新版CocoaPods的安装流程

1.移除现有Ruby默认源 $gem sources --remove https://rubygems.org/ 2.使用新的源 $gem sources -a https://ruby.taobao.org/ 3.验证新源是否替换成功 $gem sources -l 4.安装CocoaPods (1) $sudo gem install cocoapods 备注:苹果系统升级 OS X EL Capitan 后改为 $sudo gem install -n /usr/local/bin co

近一周学习之-----vue、webpack安装

1.vue安装 1.1.利用npm install -g vue vue安装完毕 2.webpack安装 npm install webpack -g webpack安装完毕 今天任务大功告成! 接下来利用webpack安装vue脚手架,开始vue学习之旅...

zabbix源码安装流程及报错解决方法

zabbix源码安装流程及报错解决方法 一. zabbix的介绍 1) zabbix是什么 zabbix是一款基于web页面的.开源的.企业级的,支持分布式部署的监控软件. 2)2.zabbix的作用 监控windows和Linux主机上的软硬件状态. 监控各网络设备,如路由器.交换机.防火墙.f5.打印机等. 支持邮件短信微信等平台发送告警通知. 通过web页面及图形展示监控数据. 3)zabbix的特性 由zabbix server和agent程序协同工作,还支持分布式监控,这时需要安装za

webpack安装配置使用教程详解

webpack安装配置使用教程详解 www.111cn.net 更新:2015-09-01 编辑:swteen 来源:转载 本文章来为各位详细的介绍一下关于webpack安装配置使用教程吧,这篇文章对于不喜欢使用 jspm测试的朋友可以参考一下. webpack 入门 目录 1 安装 webpack2 初始化项目3 webpack 配置4 自动刷新5 第三方库6 模块化7 打包.构建8 webpack 模板我最近大量使用的是 jspm,但因为用它搭建的前端开发环境中,写测试代码非常困难,而项目又

【JavaScript】 Webpack安装及文件打包

背景 最近开启一个新项目,需要对前端的各类资源文件进行打包,经过多方调研后,决定使用webpack工具.但是网上的教程多是将webpack直接作为服务器使用,而我只是想将其作为单纯的资源打包工具而已.经过多方调研,终于发现如何实现webpack的文件打包功能. 准备 在使用webpack之前,必须先要安装nodejs和npm. 安装完npm后,由于npm国内访问非常慢,可以设置为从淘宝的镜像下载各种资源包. npm config set registry http://registry.cnpm

webpack安装

一.webpack安装和命令行 打开cmd命令行,新建一个webpack-test文件夹,然后进入该文件夹中. mkdir webpack-test cd webpack-test 进行初始化.(之后会出现一系列提问,可一直按回车键直至完成) npm init 开始安装webpack. npm install webpack --save-dev 在webpack-test文件夹下新建hello.js文件.用编辑器打开进行编码. function hello(str) { alert(str);

Python+Eclipse安装流程

一.安装Eclipse 二.安装Python python的下载地址:http://www.python.org/getit/ 进入下载地址后,根据你的需求(系统.版本)进行下载.在这里我下载的是:python-3.4.1.msi,下载完后直接点击安装即可.我的安装目录为:C:\Python34 然后配置系统环境:我的电脑 —>属性—>高级—>环境变量—>系统变量 设置Path,将你的python的安装路径写入Path变量中即可. 三.安装PyDev插件 官方地址:http://p