yulilong / xile-tmp Goto Github PK

这是一个使用webpack打包工具管理的HTML前端项目模板，使用原生的HTML、JavaScript，没有使用前端框架。

CSS可以使用LESS、SCSS、CSS

本人用这个模板写了好几个项目了。

1. 项目生成的项目打包目录是dist，可在webpack.base.config.js文件里修改

项目本地开发需要nodejs环境，一般Mac电脑自带nodejs，如果没有，nodejs下载：http://nodejs.cn/download/

选择对应操作系统后安装。安装成功后终端运行如下命令查看是否安装成功：

➜  ~ node -v
v6.11.1
➜  ~ npm -v
6.0.1

如果显示了版本号则说明安装成功。

clone项目后， 终端打开项目，运行npm install安装项目的依赖包：

~ npm install

依赖包安装好后，终端输入npm start启动服务:

~ npm start

Project is running at http://localhost:3000/
webpack output is served from /

稍等一会，服务会自动打开浏览器，查看效果。

如果没有打开浏览器，请手动在浏览器中打开http://localhost:3000/

本地服务启动后，即可在开发、修改代码，保存后可实时在页面查看效果。

终端输入npm run build开始打包生成项目:

~ npm run build

> [email protected] build /Users/dragon/work/html-webpack
> webpack --config ./config/webpack.config.prod.js
.....
...

稍等一会，就会在项目的目录中看见一个dist文件夹，里面就是生成的项目