Code Monkey home page Code Monkey logo

bootvue's Introduction

BootVue Build Status

A grails 3 and vuejs 2 starter project
Build Status

What's included

  • grails: 3.3.1
  • vue js: 2.5.2
  • vuex: 3.0.1
  • vue-resource: 1.3.4
  • vue-router: 3.0.1
  • vuex-router-sync: 5.0.0

Project structure

Grails rest-api profile is used in this project.
Vue app is placed under src/app directory with following modification on config/index.js:

index: path.resolve(__dirname, '../../main/webapp/index.html'),
assetsRoot: path.resolve(__dirname, '../../main/webapp'),

Gradle plugin and tasks

buildscript {
    // ... other configs ...
    dependencies {
        // ... other classpath dependencies ...
        classpath "com.moowork.gradle:gradle-node-plugin:1.2.0"
    }
}
// apply plugin
apply plugin: "com.moowork.node"
node {
    version = '9.1.0'
    npmVersion = '5.5.1'
    yarnVersion = '1.3.2'
    download = true
    distBaseUrl = 'https://nodejs.org/dist'
    nodeModulesDir = file("src/app")
}

task watchApp(type: YarnTask, dependsOn: 'yarn') {
    group = 'application'
    description = 'Build and watch client side assets'
    args = ['run', 'dev']
}

task buildApp(type: YarnTask, dependsOn: 'yarn') {
    group = 'build'
    description = 'Compile client side assets for production'
    args = ['run', 'build']
}

task testApp(type: YarnTask, dependsOn: 'yarn') {
    group = 'verification'
    description = 'Executes client side unit tests'
    args = ['run', 'unit']
}

bootRun.dependsOn(buildApp)

assetCompile.dependsOn(buildApp)

test.dependsOn(testApp)

clean {
    def ft = fileTree('src/main/webapp').exclude(".gitkeep")
    ft.visit { FileVisitDetails fvd ->
        delete fvd.file
    }
}

Sample command

// start grails application
# grails run-app

// run this watcher task
# ./gradlew watchApp
// or for win
# gradlew watchApp

// build war file as usual
# grails war

Guide followed. Work is still in-progress. Contributions are welcome.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.