Skip to content
vue-template-for-hbuilder
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
docs
template add demo Dec 23, 2017
.gitignore
README.md
circle.yml
deploy-docs.sh
meta.js
package.json
test.sh add test script Feb 3, 2017

README.md

vue-template-for-hbuilder

使用Vue单文件,开发Html5+应用

说明:

该模板生成自 vue-cli,对其dev模式进行了修改,用来使用hbuilder的开发

项目背景,自己之前开发了一个 app,使用的mui,后来引入了Vue,由于Hbuilder,还没编译es6的功能,及hbuilder有自己的web服务器,如果我们自己启动web服务的话,又不能将编译结果实时的推送到真机调试模式下,所以产生了修改vue项目模板的需求。

使用方法:

$ npm install -g vue-cli
$ vue init aOrz/vue-template-for-hbuilder my-project
$ cd my-project
$ npm install
$ npm run dev

使用Hbuilder打开my-project/dist中的目录,打开 manifest.json 点击云端获取,获取appid,并同步到 src/manifest.json 中,然后真机运行。 npm run dev 后代码会自动更新到 dist 目录,请不要用 Hbuilder 打开编译后的文件,以免影响真机测试

Build Setup

# install dependencies
npm install

# 自动编译结果到指定文件夹
npm run dev

# serve with hot reload at localhost:8080
npm run webdev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

分享交流

打赏 加小助手进微信群(请先 star)

vue-webpack-boilerplate

A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction.

This template is Vue 2.0 compatible. For Vue 1.x use this command: vue init webpack#1.0 my-project

Documentation

  • For this template: common questions specific to this template are answered and each part is described in greater detail
  • For Vue 2.0: general information about how to work with Vue, not specific to this template

Usage

This is a project template for vue-cli. It is recommended to use npm 3+ for a more efficient dependency tree.

$ npm install -g vue-cli
$ vue init aOrz/vue-template-for-hbuilder my-project
$ cd my-project
$ npm install
$ npm run dev

If port 8080 is already in use on your machine you must change the port number in /config/index.js. Otherwise npm run dev will fail.

What's Included

  • npm run dev: first-in-class development experience.

    • Webpack + vue-loader for single file Vue components.
    • State preserving hot-reload
    • State preserving compilation error overlay
    • Lint-on-save with ESLint
    • Source maps
  • npm run build: Production ready build.

    • JavaScript minified with UglifyJS.
    • HTML minified with html-minifier.
    • CSS across all components extracted into a single file and minified with cssnano.
    • All static assets compiled with version hashes for efficient long-term caching, and a production index.html is auto-generated with proper URLs to these generated assets.
    • Use npm run build --reportto build with bundle size analytics.
  • npm run unit: Unit tests run in PhantomJS with Karma + Mocha + karma-webpack.

    • Supports ES2015+ in test files.
    • Supports all webpack loaders.
    • Easy mock injection.
  • npm run e2e: End-to-end tests with Nightwatch.

    • Run tests in multiple browsers in parallel.
    • Works with one command out of the box:
      • Selenium and chromedriver dependencies automatically handled.
      • Automatically spawns the Selenium server.

Fork It And Make Your Own

You can fork this repo to create your own boilerplate, and use it with vue-cli:

vue init username/repo my-project
You can’t perform that action at this time.