- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试获取 webpack 和 mapbox-gl在 Meteor 系统中协同工作。我到处都查看了上述错误,但没有一个有效。这是我的 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 的方式略有不同。
这是我的 npm 设置的 package.json
"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'
}]
}
};
我从 here 获取设置。还有我的 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
最佳答案
以下 webpack.config.js 对我有用。它融合了 @also 的 brfs 匹配器的好主意:
var webpack = require('webpack')
var path = require('path')
module.exports = {
entry: './app.js',
output: { path: __dirname, filename: 'bundle.js' },
resolve: {
extensions: ['', '.js'],
alias: {
webworkify: 'webworkify-webpack',
'mapbox-gl': path.resolve('./node_modules/mapbox-gl/dist/mapbox-gl.js')
}
},
module: {
loaders: [
{
test: /\.jsx?$/,
loader: 'babel',
exclude: /node_modules/,
query: {
presets: ['es2015', 'stage-0']
}
},
{
test: /\.json$/,
loader: 'json-loader'
},
{
test: /\.js$/,
include: path.resolve(__dirname, 'node_modules/webworkify/index.js'),
loader: 'worker'
},
{
test: /mapbox-gl.+\.js$/,
loader: 'transform/cacheable?brfs'
}
]
},
};
我有一个working example我一直在更新。
关于meteor - 未捕获的类型错误 : fs. readFileSync 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37608118/
我尝试使用方法获取文件 readFileSync : import fs from 'fs'; import path from 'path'; const templateFile = fs.rea
我对 Node.js 比较陌生,一直在四处寻找,但找不到解决方案。我确实检查了需要的 javascript 文件,它似乎没有“readFileSync”的方法。也许我没有合适的要求文件?我很难找到这个
我正在开发Electron应用程序。 我有src文件夹中的几个JSON文件,需要在应用初始化(设置,配置等)期间将它们复制到用户文件夹中。 在开发人员模式下以及当我对JSON文件进行import时,它
我有一个上传文件的代码这里是代码: var oriPath = JSON.stringify(req.files.profilePicture); va
我尝试了所有这些步骤来将 bpmn 属性面板集成到本地主机中,例如 Integration of Properties panel in localhost . 此后我得到了未捕获错误:fs.read
我正在尝试在 nodejs 的帮助下获取文件内容fs.readFileSync()像这样将函数转换为字符串: let fileData = fs.readFileSync('./path, 'utf8
在我的 Node 应用程序中,我有一个 init 函数: function init() { if (!fs.existsSync("../schedule.json")) f
我在名为 data 的目录下创建了多个函数并用名为 generatedRandomData 的函数返回的一些随机数据填充它们。为了创建多个文件,我编写了这些函数: const createFile =
基本上,我使用 Node 的 FS 模块来读取和写入 JSON 文件。编写它完全可以正常工作,但由于某种原因,读取它会返回一个空字符串。 这个文件叫做records.js const dir = 's
我写了一个简单的 JS 对象,它具有函数 csvFileToArray。函数应返回已解析的 CSV 数组。 问题是我没有传递给 readFileSync 的匿名函数的输出。 test1 已正确登录到控
我想创建从数据库中获取数据的函数,例如 executeQuery(sql)。但我不想从这个函数返回任何 promise ,也不想传递任何回调函数。我只想返回查询的结果。 例如: var rows =
我有一个脚本,可以将数据从 API 写入某些文件。我有一个对象,其中包含每个文件的文件描述符: var csvFds = { 'file1' : null, 'file2' : nul
我正在使用 Insert-css 将一个 css 文件导入到我的 npm 模块中但我得到一个错误。 var fs = require('fs'); var inserCss = require('in
这个问题已经有答案了: Anonymous function passed to readFileSync is not returning any data (2 个回答) 已关闭 6 年前。 我正
我正在尝试使用 html-pdf Node 模块从 html 生成 pdf。我目前正在使用 cloud9 IDE 运行它。 我的代码是: var fs = require("fs"); var pdf
我正在尝试获取 webpack 和 mapbox-gl在 Meteor 系统中协同工作。我到处都查看了上述错误,但没有一个有效。这是我的 webpack 设置 { "root": "src",
我正在尝试通过我正在制作的 Chrome 应用程序将十六进制文件刷新到 Arduino。我使用了基本的 NodeJS 代码(如下所示),并使用 browserify 对其进行了转换,以便它可以在浏览器
为什么这段代码不起作用?如果我评论 fs.readFileSync('file.html');代码有效并创建文件“file.html”但如果我取消注释, fs.writeFileSync 将不起作用,
考虑以下 Node.js Javascript 程序: var fs = require('fs'); var encoding1='?'; var encoding2='?'; var a = fs
以下是 NodeJS 代码示例(同步版本): var fs = require('fs'); var path = './parseLogFiles/reports'; var counter = 0
我是一名优秀的程序员,十分优秀!