javascript - NPM Run Build 命令语法不正确

Question

使用本教程:http://www.zsoltnagy.eu/step-by-step-environment-setup-of-the-react-developer-no-legacy-2016-standards/在输入 npm run build 后，我遇到了一个模糊的错误。

如果您看到我之前的问题，package.json 只有轻微的变化，我怀疑它与这些行(文件/目录名称中的空格)有关: "build": "webpack -d && copy src/app/index.html dist/index.html && webpack-dev-server --hot --inline --colors --progress --content-base src/",
"build-prod": "webpack -p && 复制 src/app/index.html dist/index.html"

但我不确定如何解决它。

谢谢。

package.json代码

{
    "name": "rapp",
    "version": "1.0.0",
    "description": "\"\"",
    "main": "index.js",
    "repository": {
        "type": "git",
        "url": "\"\""
    },
    "keywords": [
        "\"\""
    ],
    "author": "\"BH0\"",
    "license": "ISC",
    "dependencies": {
        "react-dom": "^15.5.4"
    },
    "devDependencies": {
        "babel-core": "^6.24.1",
        "babel-loader": "^7.0.0",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-react": "^6.24.1",
        "babel-preset-stage-2": "^6.24.1",
        "webpack": "^2.6.0",
        "webpack-dev-server": "^2.4.5"
    },
    "scripts": {
        "babel": "babel", 
        "webpack": "webpack", 

        "build": "webpack -d && copy src/app/index.html dist/index.html && webpack-dev-server --hot --inline --colors --progress --content-base src/",
        "build-prod": "webpack -p && copy src/app/index.html dist/index.html"
    }
}

Error message after typing 'npm run build'

webpack.config.js:

var path = require('path');

var DIST_PATH = path.resolve( __dirname, 'dist' );
var SOURCE_PATH = path.resolve( __dirname, 'src' );

module.exports = {
    entry: SOURCE_PATH + '/app/app.js',
    output: {
        path: DIST_PATH,   
        filename: 'app.dist.js',
        publicPath: '/app/'
    },  
    module: {
        loaders: [
            {
                test: /.jsx?$/,  
                loader: 'babel-loader',
                exclude: /node_modules/,
                query: {
                    presets: [
                        'es2015',
                        'react',
                        'stage-2'
                    ]
                }
            }
        ]
    }
};

请原谅我的格式化不当，但它无法正常工作(我的笔记本电脑的触控板损坏)。

Answer 1

您必须将所有文件路径更改为此\\。我测试了你的代码，它工作正常。

// webpack.config.js
var webpack = require( "webpack" ),
path = require ( "path" );

var DIST_DIR = path.resolve( __dirname, "dist" ),
    SRC_DIR = path.resolve ( __dirname, "src" );

var config = {

    entry: SRC_DIR + "\\app\\index.js",

    output: {

        path: DIST_DIR + "\\app",
        filename: "bundle.js",
        publicPath: "\\app\\"

    },

    module: {

        loaders: [{

            test: /\.js?/,
            include: SRC_DIR,
            loader: 'babel-loader',
            query: { presets: [ "env", "react", "stage-2" ] }

        }]

    }

}

module.exports = config;

// package.json
"scripts": {

    "start": "npm run build",
    "build": "webpack -d && copy src\\index.html dist\\index.html && webpack-dev-server --content-base src\\ --inline --hot",
    "build:prod": "webpack -p && copy src\\index.html dist\\index.html"

}