Git Product home page Git Product logo

Comments (6)

damianstasik avatar damianstasik commented on August 25, 2024 3
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?name=/fonts/[name]-[sha512:hash:base64:7].[ext]" },

@EyePulp try removing svg from the regex and let me know if is still breaks.

from vue-svg-loader.

EyePulp avatar EyePulp commented on August 25, 2024 1

@visualfanatic that was it - sorry for the dumb mistake!

from vue-svg-loader.

danciupuliga avatar danciupuliga commented on August 25, 2024

I have the same issue.. with a very similar setup

from vue-svg-loader.

damianstasik avatar damianstasik commented on August 25, 2024

Please try updating to v0.2, let me know if that problem still occurs.

from vue-svg-loader.

dsbert avatar dsbert commented on August 25, 2024

Seems to be working now. Thanks

from vue-svg-loader.

EyePulp avatar EyePulp commented on August 25, 2024

I'm getting a near identical issue with a near identical setup. Running v0.2 of this package with Vue 2.5.2, getting this error:

error  in ./assets/img/claim.svg
Module build failed:

 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/components/widgets/CAPLinks.vue 20:0-45
 @ ./src/views/components/widgets/CAPLinks.vue
 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/components/AP/AP.vue
 @ ./src/views/components/AP/AP.vue
 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/views/HomeView.vue
 @ ./src/views/HomeView.vue
 @ ./src/router/index.js
 @ ./src/app.js
 @ ./src/entry-server.js

example assets/img/claim.svg I'm testing with:

<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>

webpack config:

    module: {
        rules: [{
                test    : /\.vue$/,
                loader  : 'vue-loader',
                options : vueConfig
            }, {
                test    : /\.js$/,
                loader  : path.join(app_path, 'node_modules','babel-loader'),
                exclude : /node_modules/
            }, {
                test: /\.(png|jpg|gif|ico)$/,
                loader: 'url-loader',
                options: {
                    limit: 8000,
                    // name: '[name]-[sha512:hash:base64:7].[ext]'
                    name: (isProd?'/':'') + '[name]-[sha512:hash:base64:7].[ext]'
                }
            },{
                test: /img\/.*\.svg$/,
                loader: 'vue-svg-loader', // `vue-svg` for webpack 1.x
            },

            // the url-loader uses DataUrls.
            // the file-loader emits files.
            { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: `url-loader?limit=8000&mimetype=application/font-woff&name=${isProd?'/':''}fonts/[name]-[sha512:hash:base64:7].[ext]` },
            { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?name=/fonts/[name]-[sha512:hash:base64:7].[ext]" },

            {
                test: /\.css$/,
                use: isProd ? ExtractTextPlugin.extract({
                    use      : 'css-loader?minimize',
                    fallback : 'vue-style-loader'
                }) : ['vue-style-loader', 'css-loader']
            }
        ]
    },

I've tried other .svg files as well, will be happy to try any fixes. Thanks!

from vue-svg-loader.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.