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

Errors with JSX (React) and Sass #29

Closed
Bram-Zijp opened this issue Jan 2, 2017 · 1 comment
Closed

Errors with JSX (React) and Sass #29

Bram-Zijp opened this issue Jan 2, 2017 · 1 comment

Comments

@Bram-Zijp
Copy link

Bram-Zijp commented Jan 2, 2017

Environment: Windows10 -> Homestead -> Vagrant
NPM: 4.0.5
Node: 7.3.0
Laravel: 5.3

package.json:

{
  "private": true,
  "scripts": {
    "webpack": "cross-env NODE_ENV=development webpack --progress --hide-modules",
    "dev": "cross-env NODE_ENV=development webpack --watch --progress --hide-modules",
    "hmr": "cross-env NODE_ENV=development webpack-dev-server --inline --hot",
    "production": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "devDependencies": {
    "laravel-mix": "^0.2.8"
  },
  "dependencies": {
    "detect-browser": "^1.5.0",
    "jquery": "^3.1.1",
    "lodash": "^4.17.3",
    "react": "^15.4.1",
    "react-dom": "^15.4.1"
  }
}

The errors (npm run dev):

ERROR in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap!./resources/assets/sass/app.scss
Module build failed: Error: ENOENT: no such file or directory, scandir '/home/vagrant/Code/LaravelProject/node_modules/node-sass/vendor'
    at Object.fs.readdirSync (fs.js:870:18)
    at Object.getInstalledBinaries (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/extensions.js:122:13)
    at foundBinariesList (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/errors.js:20:15)
    at foundBinaries (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/errors.js:15:5)
    at Object.module.exports.missingBinary (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/errors.js:45:5)
    at module.exports (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/binding.js:15:30)
    at Object.<anonymous> (/home/vagrant/Code/LaravelProject/node_modules/node-sass/lib/index.js:14:35)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/home/vagrant/Code/LaravelProject/node_modules/sass-loader/index.js:4:12)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:13:17)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:160:10)
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:168:18
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:36:3)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:160:10)
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:168:18
 @ ./resources/assets/sass/app.scss 4:14-236
 @ multi app

ERROR in ./resources/assets/lib/HelloWorld.jsx
Module parse failed: /home/vagrant/Code/LaravelProject/resources/assets/lib/HelloWorld.jsx Unexpected token (14:12)
You may need an appropriate loader to handle this file type.
|     _render() {
|         ReactDom.render(
|             <h1>{this._text}</h1>,
|             this._container
|         )
 @ ./resources/assets/js/app.js 3:0-31
 @ multi app

ERROR in ./resources/assets/sass/app.scss
Module build failed: Error
    at /home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModule.js:143:35
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:359:11
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:165:18
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:27:11)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:160:10)
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:168:18
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:36:3)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:160:10)
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:168:18
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:36:3)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:160:10)
    at /home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:168:18
    at loadLoader (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/loadLoader.js:36:3)
    at iteratePitchingLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:164:2)
    at runLoaders (/home/vagrant/Code/LaravelProject/node_modules/loader-runner/lib/LoaderRunner.js:357:2)
    at NormalModule.doBuild (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModule.js:131:2)
    at NormalModule.build (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModule.js:179:15)
    at Compilation.buildModule (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/Compilation.js:128:9)
    at Compilation.<anonymous> (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/Compilation.js:405:8)
    at /home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModuleFactory.js:74:13
    at /home/vagrant/Code/LaravelProject/node_modules/tapable/lib/Tapable.js:168:11
    at NormalModuleFactory.<anonymous> (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/CompatibilityPlugin.js:52:4)
    at NormalModuleFactory.applyPluginsAsyncWaterfall (/home/vagrant/Code/LaravelProject/node_modules/tapable/lib/Tapable.js:172:13)
    at onDoneResolving (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModuleFactory.js:49:11)
    at onDoneResolving (/home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModuleFactory.js:180:6)
    at /home/vagrant/Code/LaravelProject/node_modules/webpack/lib/NormalModuleFactory.js:176:6
    at /home/vagrant/Code/LaravelProject/node_modules/webpack/node_modules/async/dist/async.js:3694:9

ERROR in /home/vagrant/Code/LaravelProject/node_modules/extract-text-webpack-plugin/loader.js?{"omit":1,"remove":true}!/home/vagrant/Code/LaravelProject/node_modules/style-loader/index.js!/home/vagrant/Code/LaravelProject/node_modules/css-loader/index.js!/home/vagrant/Code/LaravelProject/node_modules/postcss-loader/index.js!/home/vagrant/Code/LaravelProject/node_modules/resolve-url-loader/index.js!/home/vagrant/Code/LaravelProject/node_modules/sass-loader/index.js?sourceMap!/home/vagrant/Code/LaravelProject/resources/assets/sass/app.scss doesn't export content

@Bram-Zijp
Copy link
Author

Bram-Zijp commented Jan 3, 2017

#26 Solved the issue. I was using the --no-bin-links flag. When i run vagrant up with admin priviliged cmd i can npm install without --no-bin-links flag and get rid of the errors.
To run React JSX I just needed to add .babelrc file to root with react and es2015 preset and change the loader like so:

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

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

1 participant