Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

You may need an appropriate loader to handle this file type. #14

Open
mrkylemac opened this issue Feb 26, 2018 · 1 comment
Open

You may need an appropriate loader to handle this file type. #14

mrkylemac opened this issue Feb 26, 2018 · 1 comment

Comments

@mrkylemac
Copy link

Hoping for some help if possible! After following readme.md instructions, I'm receiving the following error via terminal:

ERROR in ./node_modules/vue-loop/VueLoop.vue
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.

<template>
<div class="loop-container" :class="{'full': full, 'horizontal': horizontal}">
<slot></slot>
 @ ./src/js/components/Parallax.js 15:15-34
 @ ./src/js/components ^\.\/.*$
 @ ./src/js/index.js

Here is my webpack.config:

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

var ExtractTextPlugin = require("extract-text-webpack-plugin");
var BrowserSyncPlugin = require('browser-sync-webpack-plugin');

module.exports = {
  entry: {
    "app": "./src/js/index.js",
    "app.min": "./src/js/index.js"
  },

  output: {
    path: __dirname + "/dist/js",
    filename: "[name].js"
  },

  resolve: {
    alias: {
      "assets": path.resolve(__dirname, "assets")
    }
  },

  plugins: [
    // js
    new webpack.optimize.UglifyJsPlugin({
      include: /\.min\.js$/,
      minimize: true
    }),

    // css
    new ExtractTextPlugin({
      filename: "../css/[name].css"
    }),

	// browserSync
	new BrowserSyncPlugin({
      host: 'localhost',
      port: 3000,
	  proxy: 'grub/',
	}),

  ],

  module: {
    rules: [
		
      // js
      {
        test: /\.js$/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["babel-preset-env"],
            plugins: ["babel-plugin-transform-class-properties"]
          }
        },
      },

      // scss
      {
        test: /\.scss$/,
        use: ExtractTextPlugin.extract({
          fallback: "style-loader",
          use: [
            {
              loader: "css-loader",
              options: {
                minimize: true,
                discardComments: {
                  removeAll: true
                }
              }
            }, {
              loader: "postcss-loader",
              options: {
                plugins: function() {
                  return [
                    require("postcss-import"),
                    require("autoprefixer")
                  ];
                }
              }
            }, {
              loader: "sass-loader"
            }
          ]
        })
      },

      // images
      {
        test: /\.(jpg|jpeg|gif|png|svg)$/,
        use: {
          loader: "url-loader"
        }
      },

      // fonts
      {
        test: /\.(ttf|eot|woff|woff2)$/,
        use: {
          loader: "url-loader"
        }
      }
    ]
  },
  watch: true
}

and package.json:

  "dependencies": {
    "babel-plugin-transform-class-properties": "^6.24.1",
    "basicscroll": "^1.2.0",
    "blazy": "^1.8.2",
    "jquery": "3.2.1",
    "jquery-ui": "^1.12.1",
    "node-sass": "^4.7.2",
    "skrollr": "^0.6.26",
    "url-loader": "^0.6.2",
    "vue": "^2.5.13",
    "vue-loader": "^13.0.0",
    "vue-loop": "^0.2.6"
  }
}

Much appriciated!

@gabrielstuff
Copy link

Same here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants