webpack配置(一)
这里再配置的时候走了些弯路,现在,把配置前的准备工作做好很重要:
首先,安装node.js,当然,npm也就有了;
其次,安装xampp,主要是为了配置Apache;
安装好后,xampp---htdocs文件夹下创建项目就好了。
好,开始步入正题:
当然最好先看下我给的参考地址,
参考:http://www.jianshu.com/p/42e11515c10f
然后在接着这个内容会比较好;
这里我主要是记录的是自己配置过程中遇到的问题:

当时这里没看懂,后来,理解了以后,是这样操作的:

结构中我们是没有看到bundle.js这个脚本的,这是在运行了webpack以后才会生成的。
还有,在配置package.json的时候,注意别写错了。
当然,现在暂时先配置到了npm start,后续再补充。
项目结构图:

app文件夹:用来存放原始数据和我们将写的JavaScript模块;
Greeter.js只包括一个用来返回包含问候信息的html元素的函数。
main.js用来把Greeter模块返回的节点插入页面。
public文件夹:用来存放准备给浏览器读取的数据(包括使用webpack生成的打包后的js文件以及一个index.html文件)
index.html文件只有最基础的html代码,它唯一的目的就是加载打包后的js文件(bundle.js)
参考:http://www.jianshu.com/p/42e11515c10f
webpack配置(一)的更多相关文章
- [webpack] 配置react+es6开发环境
写在前面 每次开新项目都要重新安装需要的包,简单记录一下. 以下仅包含最简单的功能: 编译react 编译es6 打包src中入口文件index.js至dist webpack配置react+es6开 ...
- webpack配置详解
webpack配置详解 先点个赞吧,再挨个点下面的连接,觉得不值这个赞的回来骂我啊. Webpack傻瓜式指南(一) Webpack傻瓜指南(二)开发和部署技巧 Webpack傻瓜式指南 原生的官网详 ...
- Webpack配置示例和详细说明
/* * 请使用最新版本nodejs * 默认配置,是按生产环境的要求设置,也就是使用 webpack -p 命令就可以生成正式上线版本. * 也可以使用 webpack -d -w 命令,生成用于开 ...
- vue-cli#2.0 webpack 配置分析
目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...
- webpack配置这一篇就够
最近看了一篇好文,根据这个文章重新梳理了一遍webpack打包过程,以前的一些问题也都清楚了,在这里分享一下,同时自己也做了一些小的调整 原文链接:http://www.jianshu.com/p/4 ...
- webpack配置报错:invalid configuration object.webpack has been initialisted using a configuration objcet that does not match thie API schema
最近接收了别人的项目,webpack配置总是报错如下:最后找到了解决办法,在此分享一下: 错误情况: 解决办法: 将package.json里面的colors删除掉即可
- 前端工程化(二)---webpack配置
导航 前端工程化(一)---工程基础目录搭建 前端工程化(二)---webpack配置 前端工程化(三)---Vue的开发模式 前端工程化(四)---helloWord 继续上一遍的配置,本节主要记录 ...
- vue全家桶安装以及修改webpack配置新增vue项目启动方式
一.安装node环境(自带npm) 下载地址 二.替换下载源 // 淘宝 NPM 镜像 npm install -g cnpm --registry=https://registry.npm.taob ...
- vue-cli中webpack配置详解
vue-cli是构建vue单页应用的脚手架,命令行输入vue init <template-name> <project-name>从而自动生成的项目模板,比较常用的模板有we ...
- storybook配置之基本配置和webpack配置
默认配置 Storybook有一个默认的适合(suits)大型项目开发的webpack配置,假如你使用react app,他类似于创建一个react app的配置,并经过调整(tweaked ),使其 ...
随机推荐
- Python3 isprintable() 方法
描述 判断字符串中所有字符是否都是可打印字符(in repr())或字符串为空. Unicode字符集中“Other” “Separator”类别的字符为不可打印的字符(但不包括ASCII码中的空格( ...
- Lintcode---克隆二叉树
深度复制一个二叉树. 给定一个二叉树,返回一个他的 克隆品 . 您在真实的面试中是否遇到过这个题? Yes 样例 给定一个二叉树: 1 / \ 2 3 / \ 4 5 返回其相同结构相同数值的克隆二叉 ...
- modelsim仿真中 do文件的写法技巧
网上的关于DO文件的编写好像资料不多,比较杂,所以本人总结一下常用的简单语法,方便大家查看.其实本人也刚接触DO文件没多久,有纰漏很正常,欢迎指正批评,互相学习.PS:写得有点乱 还有一个值得注意 ...
- C数据结构-栈和队列,括号匹配举例---ShinePans
1.栈和队列是两种特殊的线性表 运算操作被限定仅仅能在表的一端或两端插入,删除元素,故也称它们为限定的线性表结构 2.栈的基本运算 1).Stackinit(&s) 构 ...
- angular关于表单指令的汇总
- Spring Cloud心跳监测
Spring Cloud实现心跳监测,在服务注册和停止时,注册中心能得到通知,并更新服务实例列表 Spring Cloud注册中心添加配置: eureka.server.enable-self-pre ...
- C++之string的底层真的是用char数组来实现的么?
一.引言 遇到一个问题:使用加密库对数据进行加密,得到密文,使用string进行保存并传输,然后可以正确解密出来,但是使用string.c_str()进行参数传递则无法正确解密出明文. 原因是:密文中 ...
- CentOS6.2下安装配置MySql
转自:Linux学习之CentOS(十三)--CentOS6.4下Mysql数据库的安装与配置 如果要在Linux上做j2ee开发,首先得搭建好j2ee的开发环境,包括了jdk.tomcat.ecli ...
- GPIO 输入—按键检测
这里要用到一定的模电知识.电容两端电压不能突变,电感两端电流不能突变.这里利用了电容的放电延时实现硬件消抖.按键按下会有抖动,波形有毛刺,使得高低电平显现不明显,而按键按下时,电容放电一下,马上又被充 ...
- xcode6 dyld_sim is not owned by root
如果运行复制过来的xcode可能会这个提示,xcode6 dyld_sim is not owned by root解决方法打开终端 输入sudo xcode-select -switch /Appl ...