/
Vue SDK requirements and setup

Vue SDK requirements and setup

Owned by gabriel.georgiev (Deactivated)
Last updated: Mar 16, 2021 by Metodi Matov (Deactivated)

Prerequisite

  • Node.js version 11.0.0 or higher

  • NPM version 6.0.0 or higher

Steps for setup

  1. Install the package in your project using the command shell

    npm install git+https://github.com/hawksearch/vue-hawksearch.git#latest

  2. Create a directory in your assets folder to include all Vue.js resources (e.g. assets/js/vue).

  3. Create an index.js at a root level and add it as an entry file in webpack.config.js

    module.exports = { entry: { main: [ './assets/src/js/vue/index.js' ... ] }, resolve: { alias: { 'vue$': 'vue/dist/vue.min.js', src: path.resolve(__dirname, 'src') }, extensions: ['*', '.js', '.vue', '.json'] }, module: { rules: [ { test: /\.css$/i, use: ["style-loader", "css-loader"], }, ], }, ... }

To resolve the styles install Webpack css loader plugin:

npm install --save-dev style-loader npm install --save-dev css-loader

4. Create widgets folder in resource directory (e.g. assets/js/vue/widgets) Creating widgets with Vue SDK

5. Add all widget references in index.js (if there aren’t any created, add these later)

import "./widgets/search-box"; import "./widgets/search-results";

 

6. Build the JS resources accordingly (e.g. npm run build)

 

Related content