Laravel-mix: Too many issues for react in mix

Created on 7 Feb 2017  路  14Comments  路  Source: JeffreyWay/laravel-mix

Problems with bootstrap fonts which I know someone found a hack around it.
Problems with adding React to mix.

Now having this problem. I'm going back to the elixir right now but there should be a large warning sign saying "Hey this is experimental" because this is not ready for primetime at all.
By the way the css-base is file is in the right place and the index.jsx is also in the right place.

These dependencies were not found in node_modules:

  • /Users/joe/code/php/39dgv54/resources/assets/js/components/tryon/index.jsx
  • ./../../../node_modules/css-loader/lib/css-base.js

Did you forget to run npm install --save for them?
Asset Size Chunks Chunk Names
/js/components/index.js 6.48 kB 0 [emitted] /js/components/index
ERROR Failed to compile with 2 errors

These dependencies were not found in node_modules:

  • /resources/assets/js/components/tryon/index.jsx
  • ./../../../node_modules/css-loader/lib/css-base.js

Did you forget to run npm install --save for them?
Asset Size Chunks Chunk Names
/js/components/index.js 6.45 kB 0 [emitted] /js/components/index
mix-manifest.json 58 bytes [emitted]

npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev"
npm ERR! node v6.5.0
npm ERR! npm v3.10.3
npm ERR! code ELIFECYCLE
npm ERR! @ dev: node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the @ dev script 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! /Users/joe/code/php/39dgv54/npm-debug.log

Most helpful comment

So I just created a fresh project and followed the React setup instructions:

  • npm install babel-preset-react --save-dev
  • Add .babelrc with contents.
{
  "presets": [
    [
      "es2015",
      {
        "modules": false
      }
    ],
    "react"
  ]
}
  • npm install react react-dom --save

  • Set webpack.mix.js to:

var mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/js/app.jsx', 'public/js');
  • Set resources/assets/js/app.jsx to:
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <div>Hello world</div>,
  document.getElementById('app')
);
  • Compile: npm run dev

Everything worked perfectly.

Do you possibly have a different version of Webpack installed globally? I know that the Webpack API changed, and caused some older versions to throw that error with certain packages.

All 14 comments

It's not a hack to set the icon path for Bootstrap. It's the recommended approach for Webpack.

I can't help with your React issue unless you give me exact steps to reproduce your problem. I have no clue what is importing those dependencies.

Sorry if I sound like a douche just used to having everything work out the box with laravel. I never really post issues but been trying to get mix to work since yesterday 3pm. I'll give this another try in the future it's too early stages for me

I'm confused. You created an issue here. Do you want us to help solve the problem? Post some of your code so we can see why Webpack can't find those dependencies.

Thousands of people are using this in prime-time every day. Post some code so that we can help.

Just ran the exact same code nothing changed at all and now getting a complete different error.

following the documentation..

heres the mix file

  .sass('resources/assets/sass/app.scss', 'public/css')
  .js('/resources/assets/js/components/tryon/index.jsx', 'public/js/components')
  .webpackConfig({
    module: {
      rules: [
        {
          test: /\.jsx?$/,
          loader: 'babel',
          query: {
            presets: ['es2015', 'react'],
          },
        },
      ],
    },
  });
joes-Mac-mini:39dgv54 joe$ npm run dev

> @ dev /Users/joe/code/php/39dgv54
> node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

fallbackLoader option has been deprecated - replace with "fallback"
loader option has been deprecated - replace with "use"
 73% optimize/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/index.js:259
                var shouldExtract = !!(options.allChunks || chunk.isInitial());
                                                                  ^

TypeError: chunk.isInitial is not a function
    at /Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/index.js:259:55
    at /Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:3025:16
    at eachOfArrayLike (/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:941:9)
    at eachOf (/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:991:5)
    at Object.eachLimit (/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:3089:3)
    at ExtractTextPlugin.<anonymous> (/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/index.js:257:10)
    at Compilation.applyPluginsAsync (/Users/joe/code/php/39dgv54/node_modules/tapable/lib/Tapable.js:71:13)
    at Compilation.seal (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:525:7)
    at Compiler.<anonymous> (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compiler.js:397:15)
    at /Users/joe/code/php/39dgv54/node_modules/tapable/lib/Tapable.js:103:11
    at Compilation.<anonymous> (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:445:10)
    at /Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:417:12
    at /Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:332:10
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:52:16
    at done (/Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:246:17)
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:44:16
    at errorAndCallback (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:202:5)
    at errorOrWarningAndCallback (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:225:13)
    at /Users/joe/code/php/39dgv54/node_modules/webpack/lib/Compilation.js:229:12
    at onDoneResolving (/Users/joe/code/php/39dgv54/node_modules/webpack/lib/NormalModuleFactory.js:29:20)
    at /Users/joe/code/php/39dgv54/node_modules/webpack/lib/NormalModuleFactory.js:85:20
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:726:13
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:52:16
    at done (/Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:241:17)
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:44:16
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:723:17
    at /Users/joe/code/php/39dgv54/node_modules/async/lib/async.js:167:37
    at /Users/joe/code/php/39dgv54/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:24:19
    at onResolved (/Users/joe/code/php/39dgv54/node_modules/enhanced-resolve/lib/Resolver.js:38:18)
    at /Users/joe/code/php/39dgv54/node_modules/enhanced-resolve/lib/Resolver.js:127:10

npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev"
npm ERR! node v6.5.0
npm ERR! npm  v3.10.3
npm ERR! code ELIFECYCLE
npm ERR! @ dev: `node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ dev script 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the  package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs 
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls 
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/joe/code/php/39dgv54/npm-debug.log

So I just created a fresh project and followed the React setup instructions:

  • npm install babel-preset-react --save-dev
  • Add .babelrc with contents.
{
  "presets": [
    [
      "es2015",
      {
        "modules": false
      }
    ],
    "react"
  ]
}
  • npm install react react-dom --save

  • Set webpack.mix.js to:

var mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/js/app.jsx', 'public/js');
  • Set resources/assets/js/app.jsx to:
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <div>Hello world</div>,
  document.getElementById('app')
);
  • Compile: npm run dev

Everything worked perfectly.

Do you possibly have a different version of Webpack installed globally? I know that the Webpack API changed, and caused some older versions to throw that error with certain packages.

Ok so i ran what I had with your babelrc and your example

  .sass('resources/assets/sass/app.scss', 'public/css')
  .js('resources/assets/js/app.jsx', 'public/js/components')
;

and Got the same error

> @ dev /Users/joe/code/php/39dgv54
> node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

fallbackLoader option has been deprecated - replace with "fallback"
loader option has been deprecated - replace with "use"
 73% optimize/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/index.js:259
                var shouldExtract = !!(options.allChunks || chunk.isInitial());
                                                                  ^

TypeError: chunk.isInitial is not a function
    at /Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/index.js:259:55
    at /Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:3025:16
    at eachOfArrayLike (/Users/joe/code/php/39dgv54/node_modules/extract-text-webpack-plugin/node_modules/async/dist/async.js:941:9)

Then i removed the sass in the mix just to see what happened

  .js('resources/assets/js/app.jsx', 'public/js/components')
;

Got this error which is different

 ERROR  Failed to compile with 1 errors

This dependency was not found in node_modules:

* /Users/joe/code/php/39dgv54/resources/assets/js/app.jsx

Did you forget to run npm install --save for it?
                Asset      Size  Chunks             Chunk Names
/js/components/app.js   1.55 kB       0  [emitted]  /js/components/app
    mix-manifest.json  54 bytes          [emitted]  

I dont know why is it looking for the file inside of nodemodules?

Can you paste your package.json file here? I'm pretty sure this is related to the Webpack version being used on your project.

It's not the webpack.
on local
I'm running 2.2.1

on global
I'm running 2.2.1

{
  "private": true,
  "scripts": {
    "dev": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "hot": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.15.2",
    "babel-core": "^6.7.2",
    "babel-eslint": "^7.1.0",
    "babel-loader": "^6.2.4",
    "babel-plugin-syntax-decorators": "^6.13.0",
    "babel-plugin-transform-class-properties": "^6.6.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-runtime": "^6.6.0",
    "babel-preset-airbnb": "^2.0.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.22.0",
    "babel-preset-react-hmre": "^1.1.1",
    "babel-preset-stage-0": "^6.16.0",
    "babel-preset-stage-1": "^6.1.18",
    "babel-runtime": "^6.6.1",
    "babel-tape-runner": "^2.0.1",
    "bootstrap-sass": "^3.3.7",
    "browser-sync": "^2.15.0",
    "classnames": "^2.2.5",
    "connect-history-api-fallback": "^1.3.0",
    "cropperjs": "^0.8.1",
    "eslint": "^3.3.1",
    "eslint-config-airbnb": "^10.0.1",
    "eslint-find-rules": "^1.13.0",
    "eslint-plugin-babel": "^3.3.0",
    "eslint-plugin-flow-vars": "^0.5.0",
    "eslint-plugin-flowtype": "^2.15.0",
    "eslint-plugin-import": "^1.14.0",
    "eslint-plugin-jsx-a11y": "^2.1.0",
    "eslint-plugin-react": "^6.1.2",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.1",
    "gulp-babel": "^6.1.2",
    "gulp-concat": "^2.6.0",
    "gulp-concat-css": "^2.3.0",
    "gulp-eslint": "^3.0.1",
    "gulp-imagemin": "^3.0.3",
    "gulp-sass": "^2.3.2",
    "gulp-shell": "^0.5.2",
    "gulp-strip-debug": "^1.1.0",
    "gulp-uglify": "^2.0.0",
    "gulp-watch": "^4.3.9",
    "gulp-webpack": "^1.5.0",
    "html2canvas": "^0.5.0-beta4",
    "imagemin-pngquant": "^5.0.0",
    "immutability-helper": "^2.1.1",
    "in-publish": "^2.0.0",
    "jquery": "^3.1.0",
    "laravel-elixir": "^6.0.0-11",
    "laravel-elixir-livereload": "^1.1.6",
    "laravel-elixir-vue-2": "^0.2.0",
    "laravel-elixir-webpack-official": "^1.0.2",
    "laravel-mix": "^0.6.0",
    "laravel-mix-react": "^1.0.1",
    "lodash": "^3.10.1",
    "method-override": "^2.3.6",
    "react": "15.3.2",
    "react-addons-css-transition-group": "^15.4.2",
    "react-addons-transition-group": "^15.3.2",
    "react-addons-update": "^15.3.2",
    "react-dom": "15.3.2",
    "react-ga": "^2.1.2",
    "react-google-maps": "^4.11.0",
    "react-redux": "^4.0.0",
    "react-router": "^2.7.0",
    "react-sparklines": "^1.6.0",
    "redux": "^3.0.4",
    "redux-form": "^6.0.2",
    "redux-promise": "^0.5.3",
    "standard": "^8.4.0",
    "strip-loader": "^0.1.2",
    "vue": "^2.0.1",
    "webpack": "^2.0.2",
    "webpack-dashboard": "^0.2.0",
    "webpack-stream": "^3.2.0",
    "webpack-vendor-chunk-plugin": "^1.0.0"
  },
  "dependencies": {
    "babel-preset-react": "^6.22.0",
    "bootstrap": "^3.3.7",
    "css-loader": "^0.26.1",
    "react": "^15.3.2",
    "react-dom": "^15.3.2"
  }
}

Look at all those Laravel Elixir dependencies. You've switched over to Laravel Mix now, so remove all Elixir and Gulp references, and then reinstall from scratch. And don't pull in laravel-mix-react. You don't need that.

Ok we got some progress.

I deleted everything from gulp and elixir.
I deleted nodemodules and ran yarn install so it can start fresh

and got this error.

 error  in ./resources/assets/js/components/tryon/index.jsx

SyntaxError: Unexpected token (20:2)

  18 | //ROOTAPP
  19 | ReactDOM.render(
> 20 |   <Provider store={newstore}>
     |   ^
  21 |   <App/>
  22 | </Provider>, document.querySelector('.tryonRoot'));
  23 | 



 @ multi ./resources/assets/js/components/tryon/index.jsx ./resources/assets/sass/app.scss

                  Asset      Size  Chunks             Chunk Names
/js/components/index.js    6.8 kB       0  [emitted]  /js/components/index
      mix-manifest.json  58 bytes          [emitted]  

It's saying unexpected token because it doesn't understand that JSX for some reason. You can see here, in our setup/webpack.config.js file, that we do process .jsx files.

        {
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'babel-loader' + Mix.babelConfig()
        }

My guess is that this is happening because you don't have a .babelrc file in your project root that has:

{
  "presets": [
    [
      "es2015",
      {
        "modules": false
      }
    ],
    "react"
  ]
}

(npm install babel-preset-react --save-dev)

Jesus Christ almost 24 hours later got this working.
anyone having the same issue I got it working

  1. i was missing the "L" from .babelrc

this how my babelrc file looks

{
    "presets": [
        ["es2015", {
            "modules": false
        }],
        "react",
        "stage-0"
    ],
    "plugins": [
        "add-module-exports",
    ]
}
  1. I did not have babel-plugin-add-module-exports
    npm i --save-dev babel-plugin-add-module-exports

  2. Clean up Your package list
    package.json

{
  "private": true,
  "scripts": {
    "dev": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "hot": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.15.2",
    "babel-core": "^6.7.2",
    "babel-eslint": "^7.1.0",
    "babel-loader": "^6.2.4",
    "babel-plugin-add-module-exports": "^0.2.1",
    "babel-plugin-syntax-decorators": "^6.13.0",
    "babel-plugin-transform-class-properties": "^6.6.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-runtime": "^6.6.0",
    "babel-preset-airbnb": "^2.0.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.22.0",
    "babel-preset-react-hmre": "^1.1.1",
    "babel-preset-stage-0": "^6.16.0",
    "babel-preset-stage-1": "^6.1.18",
    "babel-runtime": "^6.6.1",
    "babel-tape-runner": "^2.0.1",
    "bootstrap-sass": "^3.3.7",
    "browser-sync": "^2.15.0",
    "classnames": "^2.2.5",
    "connect-history-api-fallback": "^1.3.0",
    "cropperjs": "^0.8.1",
    "eslint": "^3.3.1",
    "eslint-config-airbnb": "^10.0.1",
    "eslint-find-rules": "^1.13.0",
    "eslint-plugin-babel": "^3.3.0",
    "eslint-plugin-flow-vars": "^0.5.0",
    "eslint-plugin-flowtype": "^2.15.0",
    "eslint-plugin-import": "^1.14.0",
    "eslint-plugin-jsx-a11y": "^2.1.0",
    "eslint-plugin-react": "^6.1.2",
    "html2canvas": "^0.5.0-beta4",
    "imagemin-pngquant": "^5.0.0",
    "immutability-helper": "^2.1.1",
    "in-publish": "^2.0.0",
    "jquery": "^3.1.0",
    "laravel-mix": "^0.6.0",
    "lodash": "^3.10.1",
    "method-override": "^2.3.6",
    "react": "15.3.2",
    "react-addons-css-transition-group": "^15.4.2",
    "react-addons-transition-group": "^15.3.2",
    "react-addons-update": "^15.3.2",
    "react-dom": "15.3.2",
    "react-ga": "^2.1.2",
    "react-google-maps": "^4.11.0",
    "react-redux": "^4.0.0",
    "react-router": "^2.7.0",
    "react-sparklines": "^1.6.0",
    "redux": "^3.0.4",
    "redux-form": "^6.0.2",
    "redux-promise": "^0.5.3",
    "standard": "^8.4.0",
    "strip-loader": "^0.1.2",
    "vue": "^2.0.1",
    "webpack": "^2.0.0",
    "webpack-dashboard": "^0.2.0",
    "webpack-stream": "^3.2.0",
    "webpack-vendor-chunk-plugin": "^1.0.0"
  },
  "dependencies": {
    "babel-preset-react": "^6.22.0",
    "bootstrap": "^3.3.7",
    "css-loader": "^0.26.1",
    "react": "^15.4.2",
    "react-dom": "^15.4.2"
  }
}
  1. I deleted the nodemodules folder

  2. ran on terminal
    npm -g update
    npm install
    npm update

and for the hell of it

yarn install
yarn upgrade

Now everything works. Is it as easy as elixir or gulp ... no... but it works... just stick through it

The main issue here was that your package.json file was a mess, so you weren't using the version of Mix's required dependencies that you thought you were.

@JeffreyWay Thank you for sticking it out with me this last few hours.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mementoneli picture mementoneli  路  3Comments

wendt88 picture wendt88  路  3Comments

nezaboravi picture nezaboravi  路  3Comments

terion-name picture terion-name  路  3Comments

hasnatbabur picture hasnatbabur  路  3Comments