Manual Configuration
This information is intended for advanced users who wish to configure a Vuido application manually. In most cases the automatic quick setup should be enough.
1
npm install --save vuido
Copied!
In order to use single-file components, you will also need webpack and vue-loader. The configuration is similar to a web application using Vue.js, with some important differences:
- The vuido-template-compiler must be used instead of the standard vue-template-compiler which is used by vue-loader by default. Use the
compileroption to pass the Vuido compiler to vue-loader. Note that this option requires vue-loader v15 or newer. - Set the target option to 'node' to ensure that the compiled script can be run correctly by Node.js.
- Use webpack.ExternalsPlugin to exclude libui-node and other native modules from the bundle.
Example of webpack configuration using Vuido:
webpack.config.js
1
const path = require( 'path' );
2
const webpack = require( 'webpack' );
3
const VueLoaderPlugin = require( 'vue-loader/lib/plugin' );
4
const VuidoTemplateCompiler = require( 'vuido-template-compiler' );
5
​
6
module.exports = {
7
mode: 'development',
8
entry: './src/main.js',
9
output: {
10
path: path.resolve( __dirname, '../dist' ),
11
filename: 'main.js'
12
}
13
target: 'node',
14
module: {
15
rules: [
16
{
17
test: /\.vue$/,
18
loader: 'vue-loader',
19
options: {
20
compiler: VuidoTemplateCompiler
21
}
22
},
23
{
24
test: /\.js$/,
25
loader: 'babel-loader',
26
exclude: /node_modules/
27
}
28
]
29
},
30
resolve: {
31
extensions: [ '.js', '.vue', '.json' ]
32
},
33
plugins: [
34
new webpack.ExternalsPlugin( 'commonjs', [ 'libui-node' ] ),
35
new VueLoaderPlugin()
36
]
37
};
Copied!
The basic Babel configuration which compiles the scripts for Node.js v8 looks like this:
.babelrc
1
{
2
"presets": [
3
[ "env", {
4
"targets": {
5
"node": 8
6
},
7
"modules": false,
8
"useBuiltIns": true
9
} ]
10
],
11
"comments": false
12
}
Copied!
Last modified 3yr ago
Copy link