Это мой первый опыт использования глотка. Я пытаюсь импортировать react-route-dom
в свой index.jsx
. Но когда я пытаюсь импортировать его, я сталкиваюсь с таким сообщением об ошибке:
'response-router-dom' импортируется projectMyAccount.Site \ project.MyAccount.Site.Desktop \ scripts \ js \ desktop \ bundle \ app.js, но не может быть разрешен - рассматривается как внешняя зависимость Имя не указано для внешнего модуля 'react-router-dom' в options.globals - угадывание '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.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>);
}
};
Но я считаю, что это не очень хорошо для развития на длительный период. Как я могу реализовать это из узловых модулей?