Meteor システム内でwebpack とmapbox-glを連携させようとしています。上記のエラーについてどこでも調べましたが、何も機能しません。これが私のwebpackセットアップです
{
"root": "src",
"devServer": {
"host": "localhost"
},
"sass": {
"module": true
},
"css": {
"module": true
},
"node": {
"fs": "empty"
},
"externals": {
"fs": "{}",
"tls": "{}",
"net": "{}",
"console": "{}"
},
"module": {
"loaders": [
{
"test": "/\\.js$/",
"include": "./node_modules/mapbox-gl/js/render/painter/use_program.js",
"loader": "transform/cacheable?brfs"
}, {
"test": "/\\.js$/",
"include": "./node_modules/mapbox-gl-shaders/index.js",
"loader": "transform/cacheable?brfs"
}, {
"test": "/\\.js$/",
"include": "./node_modules/webworkify-webpack/index.js",
"loader": "worker"
}, {
"test": "/\\.css$/",
"loader": "style!css?importLoaders=1!autoprefixer",
"include": [
"./node_modules"
]
}, {
"test": "/\\.scss$/",
"include": [
"./node_modules"
]
}, {
"test": "/\\.sass$/",
"loader": "!style!css!sass?indentedSyntax!",
"include": [
"./node_modules"
]
}, {
"test": "/\\.json$/",
"loader": "json-loader"
}, {
"test": "/\\.(png|jpg|jpeg|gif)$/",
"loader": "url-loader"
}
]
},
"postcss": [ "autoprefixer({ browsers: [last 2 versions'] })" ],
"postLoaders": [
{
"include": "./node_modules/mapbox-gl/",
"loader": "transform",
"query": "brfs"
}
],
"resolve": {
"alias": {
"webworkify": "webworkify-webpack"
}
}
}
参考までに、 Reactive Stackが提供する webpack を使用しており、webpack のセットアップ方法が少し異なります。
これが私package.jsonのnpmセットアップです
"dependencies": {
"meteor-node-stubs": "^0.2.3",
"meteoredux": "0.0.2",
"numeral": "^1.5.3",
"object-assign": "^4.0.1",
"react": "^0.14.8",
"react-addons-create-fragment": "^0.14.8",
"react-addons-css-transition-group": "^0.14.8",
"react-addons-linked-state-mixin": "^0.14.8",
"react-addons-perf": "^0.14.8",
"react-addons-pure-render-mixin": "^0.14.8",
"react-addons-test-utils": "^0.14.8",
"react-addons-transition-group": "^0.14.8",
"react-addons-update": "^0.14.8",
"react-dom": "^0.14.8",
"react-helmet": "^3.0.0",
"react-mixin": "^3.0.4",
"react-redux": "^4.4.4",
"react-tap-event-plugin": "^0.2.2",
"redux": "^3.4.0",
"string": "^3.3.1"
},
"devDependencies": {
"babel": "^6.3.26",
"babel-core": "^6.7.4",
"babel-loader": "^6.2.4",
"babel-plugin-add-module-exports": "^0.1.2",
"babel-plugin-react-transform": "^2.0.0",
"babel-plugin-transform-decorators-legacy": "^1.3.2",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
"brfs": "^1.4.3",
"css-loader": "^0.23.1",
"expose-loader": "^0.7.1",
"extract-text-webpack-plugin": "^0.9.1",
"file-loader": "^0.8.5",
"geojson": "^0.3.0",
"less": "^2.3.1",
"less-loader": "^2.2.3",
"node-sass": "^3.6.0",
"react-transform-catch-errors": "^1.0.0",
"react-transform-hmr": "^1.0.1",
"redbox-react": "^1.2.0",
"sass-loader": "^3.2.0",
"sass-resources-loader": "^1.0.2",
"style-loader": "^0.13.1",
"url-loader": "^0.5.7",
"webpack": "^1.13.0",
"webpack-hot-middleware": "^2.4.1",
"json-loader": "^0.5.4",
"webworkify-webpack": "^1.1.0",
"transform-loader": "^0.2.3",
"mapbox-gl": "^0.19.0"
}
私は何を間違えましたか？MDGの誰かがエラーを説明できることに感謝します.Meteorシステムと何か関係があると私は信じています. 参考までに、私npm startはページを実行するために使用します
アップデート
@also からの提案に基づいて、セットアップの一部をwebpack.conf.js
const path = require('path');
const webpack = require('webpack');
module.exports = {
resolve: {
extensions: ['', '.js', '.jsx'],
alias: {
webworkify: 'webworkify-webpack'
}
},
module: {
loaders: [{
test: /\.json$/,
loader: 'json-loader'
}, {
test: /\.js$/,
include: path.resolve('./node_modules/mapbox-gl-shaders/index.js'),
loader: 'transform/cacheable?brfs'
}],
postLoaders: [{
include: /node_modules\/mapbox-gl-shaders/,
loader: 'transform',
query: 'brfs'
}]
}
};
ここからセットアップを取得します。と私webpack.json
{
"root": "src",
"devServer": {
"host": "localhost"
},
"sass": {
"module": true
},
"css": {
"module": true
},
"module": {
"loaders": [
{
"test": "/\\.css$/",
"loader": "style!css?importLoaders=1!autoprefixer",
"include": [
"./node_modules",
"./src/SewApps/client/css",
"./src/SewApps/client/Search/css"
]
}, {
"test": "/\\.scss$/",
"include": [
"./node_modules",
"./src/SewApps/client/css",
"./src/SewApps/client/Search/css"
]
}, {
"test": "/\\.sass$/",
"loader": "!style!css!sass?indentedSyntax!",
"include": [
"./node_modules"
]
}, {
"test": "/\\.(png|jpg|jpeg|gif)$/",
"loader": "url-loader"
}
]
},
"postcss": [ "autoprefixer({ browsers: [last 2 versions'] })" ]
}
しかし、私はまだ別のエラーに遭遇しました
=> Exited with code: 8
W20160609-14:26:04.106(8)? (STDERR)
W20160609-14:26:04.107(8)? (STDERR) /Users/muhaimincs/Documents/soulja/src/.meteor/local/build/programs/server/app/server.js:59
W20160609-14:26:04.107(8)? (STDERR) import { ReactRouterSSR } from 'meteor/reactrouter:react-router-ssr';
W20160609-14:26:04.107(8)? (STDERR) ^^^^^^
W20160609-14:26:04.107(8)? (STDERR) SyntaxError: Unexpected reserved word
W20160609-14:26:04.107(8)? (STDERR) at /Users/muhaimincs/Documents/suolja/src/.meteor/local/build/programs/server/boot.js:278:30
W20160609-14:26:04.107(8)? (STDERR) at Array.forEach (native)
W20160609-14:26:04.107(8)? (STDERR) at Function._.each._.forEach (/Users/muhaimincs/.meteor/packages/meteor-tool/.1.3.1.r1m70++os.osx.x86_64+web.browser+web.cordova/mt-os.osx.x86_64/dev_bundle/server-lib/node_modules/underscore/underscore.js:79:11)
W20160609-14:26:04.107(8)? (STDERR) at /Users/muhaimincs/Documents/soulja/src/.meteor/local/build/programs/server/boot.js:133:5