안녕하세요 저는이 repo https://github.com/aepsilon을 설치하려고합니다. npm -no-bin-links, npm i webpack -g 및 기타 패키지를 실행했지만 웹 팩 구성 방법을 찾을 수 없습니다. 난이 오류가 발생했습니다 config.js 때문에 매번 내가 실행 NPM webpack-dev-server --progress --colors --display-error-details --host=0.0.0.0
Webpack.config.js 구성
어떻게 내가 내 webpack.config.js를 구성 할 수 있습니다 시작 https://github.com/webpack/webpack-dev-server/issues/183 여기
내 webpack.config.js 및 package.json
'use strict';
/* eslint-env node, es6 */
const path = require('path');
const webpack = require('webpack');
/////////////
// Utility //
/////////////
/**
* Recursively merges two webpack configs.
* Concatenates arrays, and throws an error for other conflicting values.
*/
function merge(x, y) {
if (x == null) { return y; }
if (y == null) { return x; }
if (x instanceof Array && y instanceof Array) {
return x.concat(y);
} else if (Object.getPrototypeOf(x) === Object.prototype &&
Object.getPrototypeOf(y) === Object.prototype) {
// for safety, only plain objects are merged
let result = {};
(new Set(Object.keys(x).concat(Object.keys(y)))).forEach(function (key) {
result[key] = merge(x[key], y[key]);
});
return result;
} else {
throw new Error(`cannot merge conflicting values:\n\t${x}\n\t${y}`);
}
}
/////////////////
// Base Config //
/////////////////
const srcRoot = './src/';
const commonConfig = {
entry: {
TMViz: [srcRoot + 'TMViz.js'],
main: srcRoot + 'main.js'
},
output: {
library: '[name]',
libraryTarget: 'var', // allow console interaction
path: path.join(__dirname, 'build'),
publicPath: '/build/',
filename: '[name].bundle.js'
},
externals: {
'ace-builds/src-min-noconflict': 'ace',
'bluebird': 'Promise',
'clipboard': 'Clipboard',
'd3': 'd3',
'jquery': 'jQuery',
'js-yaml': 'jsyaml',
'lodash': 'lodash',
'lodash/fp': '_'
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
// Note on ordering:
// Each "commons chunk" takes modules shared with any previous chunks,
// including other commons. Later commons therefore contain the fewest dependencies.
// For clarity, reverse this to be consistent with browser include order.
// names: ['util', 'TuringMachine', 'TapeViz', 'StateViz'].reverse()
names: ['TMViz'].reverse()
})
],
module: {
loaders: [
// copy files verbatim
{ test: /\.css$/,
loader: 'file',
query: {
name: '[path][name].[ext]',
context: srcRoot
}
}
]
}
};
//////////////////////
// Dev/Prod Configs //
//////////////////////
const devConfig = {
output: {pathinfo: true}
};
const prodConfig = {
devtool: 'source-map', // for the curious
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(true),
new webpack.optimize.UglifyJsPlugin({compress: {warnings: false}})
]
};
const isProduction = (process.env.NODE_ENV === 'production');
module.exports = merge(commonConfig, isProduction ? prodConfig : devConfig);
입니다
내 package.json
{
"name": "turing-machine-viz",
"version": "1.0.0",
"description": "Turing machine visualization and simulator",
"homepage": "http://turingmachine.io",
"license": "BSD-3-Clause",
"author": "Andy Li <[email protected]>",
"repository": "aepsilon/turing-machine-viz",
"scripts": {
"clean": "trash build/ || rm -r build/",
"depgraph": "mkdir -p build/ && (cd src/ && madge . --dot) > build/depgraph.gv",
"depgraph-noext": "mkdir -p build/ && (cd src/ && madge . --dot -x \"`node -e \"console.log(Object.keys(require('../webpack.config').externals).map(s => '^'+s+'$').join('|'))\"`\") > build/depgraph-noext.gv",
"lint": "eslint --cache webpack.config.js src/",
"prod": "export NODE_ENV=production; npm run lint && webpack --progress --colors --display-error-details",
"start": "webpack-dev-server --progress --colors --display-error-details --host=0.0.0.0",
"watch": "webpack --watch --progress --colors --display-error-details"
},
"dependencies": {
"webpack-dev-server": "^2.9.5"
},
"devDependencies": {
"eslint": "^3.0.0",
"file-loader": "^0.8.5",
"raw-loader": "^0.5.1",
"webpack": "^1.12.9"
}
}
그것은 변경되지 않습니다. –
npm install을 다시 실행했는데 오류가 있습니까? – Gearoid
"npm start"를 실행하면이 오류가 발생합니다. webpack-dev-server --progress --colors --display-error-details --host = 0.0.0.0 –