Node.js 如果没有全局安装的节点应用程序中的节点\ U模块,如何要求本地文件夹中的react组件?
因此,我得到了一个需要全局安装的包,它接受用户定义的react组件并呈现它们。我使用巴别塔寄存器并定义:Node.js 如果没有全局安装的节点应用程序中的节点\ U模块,如何要求本地文件夹中的react组件?,node.js,reactjs,npm,babeljs,babel-register,Node.js,Reactjs,Npm,Babeljs,Babel Register,因此,我得到了一个需要全局安装的包,它接受用户定义的react组件并呈现它们。我使用巴别塔寄存器并定义: require('babel-register')({ presets: [ 'es2015', 'stage-0', 'react', ], }); 我的package.json文件如下所示: "dependencies": { "babel-preset-es2015": "^6.24.1", "babel
require('babel-register')({
presets: [
'es2015',
'stage-0',
'react',
],
});
我的package.json
文件如下所示:
"dependencies": {
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.24.1",
"babel-runtime": "^6.23.0",
"chokidar": "^1.7.0",
"del": "^2.2.2",
"marked": "^0.3.6",
"react": "^15.5.4",
"react-dom": "^15.5.4",
"window-size": "^1.0.0",
"yamljs": "^0.2.10"
},
现在,由于这些用户定义的react组件有时位于未安装.babelrc
或任何软件包的位置,因此我非常希望使用已与软件包依赖项一起全局安装的组件。当您在全球范围内安装我的软件包时,我试图避免必须安装这些依赖项。虽然不知道怎么做
我检查了node_模块文件夹,并在其中安装了所有依赖项:
.
[...]
├── babel-code-frame
├── babel-core
├── babel-generator
├── babel-helper-bindify-decorators
├── babel-helper-builder-binary-assignment-operator-visitor
├── babel-helper-builder-react-jsx
├── babel-helper-call-delegate
├── babel-helper-define-map
├── babel-helper-explode-assignable-expression
├── babel-helper-explode-class
├── babel-helper-function-name
├── babel-helper-get-function-arity
├── babel-helper-hoist-variables
├── babel-helper-optimise-call-expression
├── babel-helper-regex
├── babel-helper-remap-async-to-generator
├── babel-helper-replace-supers
├── babel-helpers
├── babel-messages
├── babel-plugin-check-es2015-constants
├── babel-plugin-syntax-async-functions
├── babel-plugin-syntax-async-generators
├── babel-plugin-syntax-class-constructor-call
├── babel-plugin-syntax-class-properties
├── babel-plugin-syntax-decorators
├── babel-plugin-syntax-do-expressions
├── babel-plugin-syntax-dynamic-import
├── babel-plugin-syntax-exponentiation-operator
├── babel-plugin-syntax-export-extensions
├── babel-plugin-syntax-flow
├── babel-plugin-syntax-function-bind
├── babel-plugin-syntax-jsx
├── babel-plugin-syntax-object-rest-spread
├── babel-plugin-syntax-trailing-function-commas
├── babel-plugin-transform-async-generator-functions
├── babel-plugin-transform-async-to-generator
├── babel-plugin-transform-class-constructor-call
├── babel-plugin-transform-class-properties
├── babel-plugin-transform-decorators
├── babel-plugin-transform-do-expressions
├── babel-plugin-transform-es2015-arrow-functions
├── babel-plugin-transform-es2015-block-scoped-functions
├── babel-plugin-transform-es2015-block-scoping
├── babel-plugin-transform-es2015-classes
├── babel-plugin-transform-es2015-computed-properties
├── babel-plugin-transform-es2015-destructuring
├── babel-plugin-transform-es2015-duplicate-keys
├── babel-plugin-transform-es2015-for-of
├── babel-plugin-transform-es2015-function-name
├── babel-plugin-transform-es2015-literals
├── babel-plugin-transform-es2015-modules-amd
├── babel-plugin-transform-es2015-modules-commonjs
├── babel-plugin-transform-es2015-modules-systemjs
├── babel-plugin-transform-es2015-modules-umd
├── babel-plugin-transform-es2015-object-super
├── babel-plugin-transform-es2015-parameters
├── babel-plugin-transform-es2015-shorthand-properties
├── babel-plugin-transform-es2015-spread
├── babel-plugin-transform-es2015-sticky-regex
├── babel-plugin-transform-es2015-template-literals
├── babel-plugin-transform-es2015-typeof-symbol
├── babel-plugin-transform-es2015-unicode-regex
├── babel-plugin-transform-exponentiation-operator
├── babel-plugin-transform-export-extensions
├── babel-plugin-transform-flow-strip-types
├── babel-plugin-transform-function-bind
├── babel-plugin-transform-object-rest-spread
├── babel-plugin-transform-react-display-name
├── babel-plugin-transform-react-jsx
├── babel-plugin-transform-react-jsx-self
├── babel-plugin-transform-react-jsx-source
├── babel-plugin-transform-regenerator
├── babel-plugin-transform-strict-mode
├── babel-preset-es2015
├── babel-preset-flow
├── babel-preset-react
├── babel-preset-stage-0
├── babel-preset-stage-1
├── babel-preset-stage-2
├── babel-preset-stage-3
├── babel-register
├── babel-runtime
├── babel-template
├── babel-traverse
├── babel-types
[...]
├── react
[...]
└── yamljs
220 directories, 0 files
我收到此错误:找不到相对于目录的预设“es2015”
在本地安装是可行的,但我不能使用bin绑定和其他一些我想添加的功能
我尝试使用ignore
或only
选项,但没有成功
所以我想:
问题
如何从远离我自己的node\u modules
文件夹的文件夹中导入react组件并将其保存,该文件夹可能没有安装任何依赖项,但不会出错
更新
因此,您可以将绝对路径传递给babel寄存器
调用:
require('babel-register')({
presets: [
Path.normalize(`${ __dirname }/../node_modules/babel-preset-es2015`),
Path.normalize(`${ __dirname }/../node_modules/babel-preset-stage-0`),
Path.normalize(`${ __dirname }/../node_modules/babel-preset-react`),
]
});
这似乎有效,但现在应用程序抱怨无法找到react
:错误:无法找到模块“react”
,即使它位于依赖项中
更新#2
因此,无法找到react的错误与导入react的组件有关。我想知道是否可以将导入语句重定向到我的全局文件夹?是的,你可以使用这个漂亮的插件::)所以答案是我的
巴贝尔寄存器中的绝对路径。这解决了最初的问题希望它能帮助路过的人
require('babel-register')({
presets: [
Path.normalize(`${ __dirname }/../node_modules/babel-preset-es2015`),
Path.normalize(`${ __dirname }/../node_modules/babel-preset-stage-0`),
Path.normalize(`${ __dirname }/../node_modules/babel-preset-react`),
]
});
您是否在package.json中添加了开发依赖项?当然:)我将在问题中添加我的package.json
,包括全局文件夹的文件夹树。