-
Notifications
You must be signed in to change notification settings - Fork 121
Build large project with Vue.js and Webpack
#Vue cli template
Neutronium provides a vue-cli template neutronium-vue that provides many advantages to develop large project with Neutronium vue:
- During development use web-pack-dev-server and chrome to cretae the UI
- Use ES6, sass, less...
- Decompose your project in maintanable vue files during development
- Use npm to manage your dependencies
- Use Webpack build to generate all files you need to refence in Neutronium
To install neutronium vue template use (vue-cli)[https://github.com/vuejs/vue-cli] If not installed, install first vue-cli:
$ npm install -g vue-cli
Then in the view folder create your project
$ vue init David-Desmaisons/neutronium-vue view1
$ cd view1
$ npm install
$ npm run dev
##npm scripts
npm run dev
Debug your view in the browser. MainView model data are provided by json file: data\data.json
npm run build
Generate files ready to be used in Neutronium in the dist folder: you have to reference these files (Content/Copy Always) in visual studio.
##Step by step installation
- Open folder where you want to install the view from VS




5. Once the view is ready build the files ``` bash $ npm run build ```







##Folder organization
+root
+-data
+-dist
+-src
+-assets
+-components
+App.vue
+entry.js
+main.js
+index.hml
Data: contains the data.json which is the viewmodel data used during developement in the browser. Dist: contains generated files to be used in Neutronium src: contains assets (folder assets), vue components (folder components), main component: App.vue. You should not edit entry.js nor main,js which are bolierplate files needed for the built. Both index.html files (fromm root and dist) should not be edited for the same reason.
###[Binding in Depth](https://github.com/David-Desmaisons/Neutronium/wiki/Binding in Depth)