2

I have imported a reacted project in my computer. It gives me an error in console when I try to run the gulp command. But at the same time when I run it on ubuntu, it works perfectly fine. This is the error I am getting on windows

ERROR in ./src/client/index.js
Module parse failed: D:\Frontend-Master\src\client\index.js Unexpected token (64:2)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (64:2)
    at Parser.pp$4.raise (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:2221:15)
    at Parser.pp.unexpected (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:603:10)
    at Parser.pp$3.parseExprAtom (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1822:12)
    at Parser.pp$3.parseExprSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1715:21)
    at Parser.pp$3.parseMaybeUnary (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1692:19)
    at Parser.pp$3.parseExprOps (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1637:21)
    at Parser.pp$3.parseMaybeConditional (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1620:21)
    at Parser.pp$3.parseMaybeAssign (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1597:21)
    at Parser.pp$3.parseExprList (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:2165:22)
    at Parser.pp$3.parseSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1741:35)
    at Parser.pp$3.parseExprSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1718:17)
    at Parser.pp$3.parseMaybeUnary (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1692:19)
    at Parser.pp$3.parseExprOps (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1637:21)
    at Parser.pp$3.parseMaybeConditional (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1620:21)
    at Parser.pp$3.parseMaybeAssign (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1597:21)
    at Parser.pp$3.parseExpression (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1573:21)
 @ multi main
  -- client bundled.
Hash: f58f7ad4ec2f7df577bf
Version: webpack 1.13.3
Time: 853ms
           Asset     Size  Chunks             Chunk Names
server-bundle.js  24.5 kB       0  [emitted]  main
  -- server:watch bundled.
[14:53:35] Finished 'bundle' after 946 ms
[14:53:35] Starting 'start:server'...
Starting Node Server...
[14:53:36] Finished 'start:server' after 1.23 s
[14:53:36] Starting 'watch:sync'...
webpack built 7a9966082c49871875b8 in 386ms
Hash: 7a9966082c49871875b8
Version: webpack 1.13.3
Time: 386ms
         Asset     Size  Chunks       Chunk Names
main-bundle.js  99.3 kB       0       main

ERROR in ./src/client/index.js
Module parse failed: D:\Frontend-Master\src\client\index.js Unexpected token (64:2)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (64:2)
    at Parser.pp$4.raise (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:2221:15)
    at Parser.pp.unexpected (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:603:10)
    at Parser.pp$3.parseExprAtom (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1822:12)
    at Parser.pp$3.parseExprSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1715:21)
    at Parser.pp$3.parseMaybeUnary (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1692:19)
    at Parser.pp$3.parseExprOps (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1637:21)
    at Parser.pp$3.parseMaybeConditional (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1620:21)
    at Parser.pp$3.parseMaybeAssign (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1597:21)
    at Parser.pp$3.parseExprList (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:2165:22)
    at Parser.pp$3.parseSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1741:35)
    at Parser.pp$3.parseExprSubscripts (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1718:17)
    at Parser.pp$3.parseMaybeUnary (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1692:19)
    at Parser.pp$3.parseExprOps (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1637:21)
    at Parser.pp$3.parseMaybeConditional (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1620:21)
    at Parser.pp$3.parseMaybeAssign (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1597:21)
    at Parser.pp$3.parseExpression (D:\Frontend-Master\node_modules\acorn\dist\acorn.js:1573:21)
 @ multi main

This is my index.js file

var debug = require('debug')('tes:client')

window.Promise = Promise;
window.$ = window.jQuery = $;
injectTapEventPlugin();

var browserHistory = useRouterHistory(createHistory)({
    queryKey: false,
    basename: '/'
});

var initialState = window.INITIAL_STATE || {};

var store   = configureStore(initialState, browserHistory);
var routes  = getRoutes(store);
var history = syncHistoryWithStore(browserHistory, store, {
  selectLocationState: (state) => state.router
});

const ROOT_CONTAINER = document.getElementById('root');
const onRenderComplete = ()=> {
    console.timeEnd('render');
}

if ( __DEV__ ){
    window._STORE = store;
    window.React = React;
    window.ReactDOM = ReactDOM;
}
window.localStorage.debug = 'tessact:*'
window._History = history

let muiTheme = getMuiTheme(theme);

console.time('render');
match({ history, routes }, (error, redirectLocation, renderProps) => {
    ReactDOM.render(
        <MuiThemeProvider muiTheme={muiTheme}>
            <Root store={store}>
                <WithStylesContext onInsertCss={styles=> styles._insertCss()}>
                    <Router {...renderProps} />
                </WithStylesContext>
            </Root>
        </MuiThemeProvider>,
        ROOT_CONTAINER,
        onRenderComplete
    )
});

This is my client.config.js file

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

var DIRS = require('./dirs.js');

var stylus = require('stylus');
var nib = require('nib');
var axis = require('axis');
var rupture = require('rupture');
var bootstrap = require('bootstrap-styl');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

var IS_PROD = process.env.NODE_ENV === "production";
var config = {
    devtool: IS_PROD ? false : 'eval',
    debug: !IS_PROD,
    cache: true,
    root: DIRS.ROOT,
    watchOptions: {
        ignored: /node_modules/
    },
    entry: {
        main: [ DIRS.SRC_CLIENT + '/index.js' ]
    },
    output: {
        path: DIRS.BUILD_PUBLIC,
        publicPath: '/public/',
        filename: '[name]-bundle.js'
    },
    resolve: {
        modulesDirectories: [ DIRS.SRC_CLIENT, 'node_modules'],
        extensions: ['', '.webpack.js', '.web.js', '.js', '.styl'],
    },
    module: {
        loaders: [
            {test: /\.json$/, loader: 'json', exclude: /node_modules/},
            {test: /\.js$/, 
                loader: 'babel', 
                exclude: /node_modules/,
                include: [ DIRS.SRC_CLIENT ],
                query: {
                    cacheDirectory: true,
                    env: { 
                        development: {
                            presets: ['react-hmre']
                        }
                    } 
                }
            },
            {
                test: /\.styl$/, 
                loader: [ 
                    'isomorphic-style-loader',
                    'css?sourceMap&localIdentName=[name]_[local]_[hash:base64:3]',
                    'stylus?sourceMap'
                ].join('!')
            },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            },
            {
                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'url-loader?limit=10000&mimetype=application/font-woff'
            },
            {
                test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'file-loader'
            },{
                test: /\.(png|jpg|jpeg|gif)$/,
                loader: 'url-loader',
                query: {
                  name: IS_PROD ? '[hash].[ext]' : '[path][name].[ext]?[hash]',
                  limit: 10000,
                }
            }
        ]
    },
    plugins: [
        new webpack.DefinePlugin({
            __DEV__: !IS_PROD,
            __SERVER__: false,
            "process.env.NODE_ENV": (IS_PROD ? JSON.stringify("production") : JSON.stringify("development"))
        }),
        new webpack.ProvidePlugin({
            React: 'react'
        }),
        new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en/)
    ],
    stylus: {
        use: [nib(), axis(), rupture(), bootstrap()],
        import: path.resolve(__dirname, '../src/stylus/index.styl'),
        error: IS_PROD,
        compress: IS_PROD,
        'include css': true
    }
};

if (IS_PROD){
    // console.log('--- CLIENT:PRODUCTION_MODE ---');
    config.entry.vendors = [
        'react', 'react-dom', 'react-router',
        'lodash', 'core-js', 'moment', 'jquery', 'bluebird',
        'redux', 'react-redux', 'react-router-redux',
        'history'
    ];

    config.plugins = config.plugins.concat([  
        new webpack.optimize.CommonsChunkPlugin({
            name: 'vendors',
            filename: 'vendors-bundle.js'
        }),
        new webpack.optimize.UglifyJsPlugin({
            compress: {warnings: false},
            comments: false
        }),
        new webpack.optimize.AggressiveMergingPlugin(),
    ]);
} else {
    config.entry.main.unshift('webpack-hot-middleware/client')
    config.plugins = config.plugins.concat([
        new webpack.DllReferencePlugin({
            context: DIRS.SRC_CLIENT,
            manifest: require(DIRS.BUILD_PUBLIC + '/dll/vendor-manifest.json')
        }),
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin()
    ]);
}


module.exports = config;

And this is scripts in package.json

 "main": "index.js",
  "scripts": {
    "postinstall": "set NODE_ENV=production node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod",
    "start": "node build/server-bundle.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

There is server.config.js file also which i haven't attached as think it is not necessary. Everything of this code works file in Ubuntu.

Error after Shubham Khatri's answer. I ran both the commands in comments of his answer.

> cross-env NODE_ENV=prod & node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod

D:\Frontend-Master\node_modules\.bin\gulp:2
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
          ^^^^^^^
SyntaxError: missing ) after argument list
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.runMain (module.js:604:10)
    at run (bootstrap_node.js:394:7)
    at startup (bootstrap_node.js:149:9)
    at bootstrap_node.js:509:3

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN [email protected] No repository field.
npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v6.9.1
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! [email protected] postinstall: `cross-env NODE_ENV=prod & node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script 'cross-env NODE_ENV=prod & node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod'.
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 tessact package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cross-env NODE_ENV=prod & node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs tessact
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls tessact
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     D:\Frontend-Master\npm-debug.log
1
  • Please provide that error message in the form of text. Don't paste an unreadable screenshot. Commented Feb 1, 2017 at 9:36

2 Answers 2

1

Don't copy node modules as is, you are supposed to get all node modules again when you change OS.

Remove node_modules folder and run npm install.

BTW: importing node project with node_modules folder is not a good practice. you have to put node_modules in .gitignore

Sign up to request clarification or add additional context in comments.

4 Comments

mostly npm will download packages as per os compatibility, so 90% chances are there because of old node_modules
And I remember I never imported it with node_modules. I ran npm install after importing before also.
So, some of your node modules need os level packages which are already available in your ubuntu.. and not available in windows.
For me, this was the case. npm install did run, but npm run watch didn't.
0

The way you have set NODE_ENV for postInstall doesn't work for windows but for linux.

For cross platform compatibility set NODE_ENV like cross-env NODE_ENV=prod &

So you package.json scripts looks like

"scripts": {
    "postinstall": "cross-env NODE_ENV=prod & node -max_old_space_size=8192 ./node_modules/.bin/gulp build:prod",
    "start": "node build/server-bundle.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

Also you can install the node_modules again with the npm install command when in windows.

12 Comments

'cross-env' is not recognized as an internal or external command, operable program or batch file.
Error after doing this
you need to run npm install -S cross-env first
I think you are right but it gives me an error while running npm install. Have a look at my updates. I am adding error there.
did you find anything?
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.