niho
285
4
Vue

Include VueJS with Webpack

Posted 2 years ago by niho

I am using a tool called https://fbrctr.github.io/

I want to include Vuejs. From the docs you can use NPM and simply include this using

var Vue = require('vue');

How all i get is vue is undefined. Is this the correct way to do it or can I do it with webpack? If so how would i go about this? From any examples i have looked at they dont really fit in with the config of my webpack file.

See my webpack config below.

var path = require('path');
var webpack = require('webpack');

module.exports = function(fabricatorConfig) {

    "use strict";

    var config = {
        entry: {
            'fabricator/scripts/f': fabricatorConfig.src.scripts.fabricator,
            'toolkit/scripts/toolkit': fabricatorConfig.src.scripts.toolkit,
        },
        output: {
            path: path.resolve(__dirname, fabricatorConfig.dest, 'assets'),
            filename: '[name].js'
        },
        module: {
            loaders: [
                {
                    test: /\.js$/,
                    exclude: /(node_modules|prism\.js)/,
                /*  exclude: /(node_modules|prism\.js)(?!\/vue-smart-table\/src\/components)/*/
                    loaders: ['babel-loader']
                }
            ]
        },
          plugins: [
                new webpack.DefinePlugin({
                  'process.env': {
                    NODE_ENV: JSON.stringify('production')
                  }
                })
              ],
        cache: {},
         resolve: {
                    modulesDirectories: ['node_modules', 'bower_components']
                  }
    };

    if (!fabricatorConfig.dev) {
        config.plugins.push(
            new webpack.optimize.UglifyJsPlugin()
        );
    }

    return config;

};

Thanks for your help

Please sign in or create an account to participate in this conversation.