这是我对 gulp 的第一次体验。我尝试在我的 index.jsx
中导入 react-route-dom
。但是当我尝试导入它时,我遇到了这个错误信息:
'react-router-dom' is imported by projectMyAccount.Site\project.MyAccount.Site.Desktop\scripts\js\desktop\bundle\app.js, but could not be resolved – treating it as an external dependency No name was provided for external module 'react-router-dom' in options.globals – guessing 'reactRouterDom'
索引 Jsx:
import Index from '../pages/MyAccount/Index';
import Support from '../pages/Support/Index';
import {BrowserRouter as Router, Route,Link} from 'react-router-dom';
class Pager extends React.Component {
constructor(props){
super(props);
}
render(){
<Router>
<div>
<ul>
<li><Link to="/test1">Home</Link></li>
<li><Link to="/about-us">About Use</Link></li>
</ul>
<hr/>
<Route path="/hesabim" component={Index}/>
<Route path="/about" component={Support}/>
</div>
</Router>
}
};
主要的 gulp 任务:
gulp.task('es6', function () {
return gulp.src(filePath + '/scripts/js/**/*.js')
.pipe(babel())
.pipe(gulp.dest(filePath + '/scripts/js'));
});
gulp.task('react', function () {
return gulp.src(filePath + '/scripts/jsx/**/*.jsx')
.pipe(react({harmony: false, es6module: true}))
.pipe(gulp.dest(filePath + '/scripts/js/'));
});
gulp.task('create-app', function () {
return gulp.src([
filePath + '/Scripts/js/desktop/pages/Index.js'
])
.pipe(concatJs("hepsiburada.js"))
.pipe(gulp.dest(filePath + '/scripts/js/desktop/bundle'))
.pipe(rollup({
allowRealFiles: true,
"format": "iife",
"plugins": [
require("rollup-plugin-babel")({
"presets": [["es2015", { "modules": false }]],
"plugins": ["external-helpers"]
})
],
entry: filePath + '/scripts/js/desktop/bundle/app.js'
}))
.pipe(gulp.dest(filePath + '/build/scripts/'));
});
怎么了?我是否必须为 gulp 导入另一个包?我不清楚。我可以像这样将它与 unpkg 包一起使用:
import Index from '../pages/MyAccount/Index';
import Support from '../pages/Support/Index';
class Pager extends React.Component {
constructor(props){
super(props);
}
render(){
const Router = ReactRouterDOM.BrowserRouter;
const Link = ReactRouterDOM.Link;
const Route = ReactRouterDOM.Route;
return (<Router>
<div>
<ul>
<li><Link to="/test1">Home</Link></li>
<li><Link to="/about-us">About Use</Link></li>
</ul>
<hr/>
<Route path="/hesabim" component={Index}/>
<Route path="/about" component={Support}/>
</div>
</Router>);
}
};
但我认为长期发展是不利的。我如何从节点模块实现它?
最佳答案
看起来您可能需要将 rollup-plugin-node-resolve 添加到您的 gulp 中。在此处查看可能的答案:gulp rollup not working external resource import
关于javascript - 无法在 Gulp 项目中导入 React Router Dom,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44427829/