React项目不在Windows上运行，但在Ubuntu上运行
我在电脑里input了一个反应过来的项目。 当我尝试运行gulp命令时，它在控制台中给我一个错误。 但是，当我在Ubuntu上运行它时，它工作得很好。 这是我在窗口上的错误
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 这是我的index.js文件
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 ) });
这是我的client.config.js文件
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;
这是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" },
还有server.config.js文件也没有附加，因为认为这是没有必要的。 这个代码的所有东西在Ubuntu工作文件。
Shubham Khatri的回答之后出错。 我在回答他的评论时运行了这两个命令。
> 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 fsevents@1.0.17: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm WARN tessact@0.0.1 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! tessact@0.0.1 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 tessact@0.0.1 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
不要照原样复制节点模块，在更换操作系统时，应该再次获取所有节点模块。
删除node_modules文件夹并运行npm install。
BTW：使用node_modules文件夹导入节点项目不是一个好的做法。 您必须将.gitignore中的node_modules
您为postInstall设置NODE_ENV的方式不适用于Windows，但适用于Linux。
对于跨平台兼容性设置NODE_ENV like cross-env NODE_ENV=prod &
所以你package.json脚本看起来像
"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" },
在Windows中，您也可以使用npm install command再次安装node_modules 。