Friday 19 May 2017

Webpack error when project shared across 2 machines

I have my project saved in a Google Drive folder. It works fine on one of my machines, but on the other I get a bunch of errors when it tries to compile my code. They're all the same error and appear to be related to loading images - here's an example below (the others are all the same, just for different images)

ERROR in ./app/images/svg/xenonLogo.svg
Module build failed: TypeError: this is not a typed array.
    at Function.from (native)
    at /Users/Chris/Google Drive/AcademyReact/node_modules/imagemin-svgo/index.js:25:19
    at optimizeOnceCallback (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo.js:44:17)
    at /Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo.js:65:9
    at Object.sax.onend (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo/svg2js.js:156:13)
    at emit (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:640:35)
    at end (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:683:5)
    at Object.write (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:991:14)
    at Object.SAXParser.close (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:157:38)
    at module.exports (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo/svg2js.js:169:28)
    at SVGO._optimizeOnce (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo.js:56:5)
    at optimizeOnceCallback (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo.js:42:23)
    at /Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo.js:65:9
    at Object.sax.onend (/Users/Chris/Google Drive/AcademyReact/node_modules/svgo/lib/svgo/svg2js.js:156:13)
    at emit (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:640:35)
    at end (/Users/Chris/Google Drive/AcademyReact/node_modules/sax/lib/sax.js:683:5)
 @ ./app/TopBar.js 23:11-48

It only seems to apply to image loaders - I'm not getting any other errors.

Here's my config file:

var webpack = require('webpack');
var path = require('path');
var nodeModulesPath = path.resolve(__dirname, 'node_modules');
var buildPath = path.resolve(__dirname, 'public');
var mainPath = path.resolve(__dirname, 'app', 'main.js');

var config = {

    devtool: 'source-map',
    devServer: {
      historyApiFallback: true
    },
    entry: [

        'webpack/hot/dev-server',
        'webpack-hot-middleware/client',
        'whatwg-fetch',
        //Our application
        mainPath
    ],
    output: {
        path: '/',
        publicPath: 'http://localhost:3000/',
        //assetsPublicPath: 'http://localhost:3000/',
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.js?$/,
                loader: 'babel',
                exclude: nodeModulesPath
            },
            {
                test: /\.css$/,
                loader: 'style!css?sourceMap&modules!postcss?sourceMap'
            },
            {
                test: /\.(jpe?g|png|gif|svg)$/i,
                loaders: [
                  'file?hash=sha512&digest=hex&name=[hash].[ext]',
                  'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false'
                ]
            },
            {
                test: /\.html$/,
                loader: 'html-loader?attrs[]=video:src'
            }, 
            {
                test: /\.mp4$/,
                loader: 'url?limit=10000&mimetype=video/mp4'
            }

        ]
    },
    postcss: [
        require('autoprefixer'),
        require('precss')
    ],
    plugins: [
        new webpack.HotModuleReplacementPlugin()
    ]
};

module.exports = config;

Any ideas?



via Chris

No comments:

Post a Comment