Как подключить код из .js в main.js через @@include?
Помогите пожалуйста! Пытаюсь подключить SwiperJS локально через файлы, но когда начал подключать, на сайте в консоли выскочила ошибка:
script.js:1 Uncaught Error: Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> @@include('./libs/swiper-bundle.js')
В Sass импортировал стили swiper'а также через файл, стили применились, но в Js файле не применяется. В главном файле Js пытаюсь подключить через @@include('.....')
Как это можно исправить, что бы через @@include я подключал файл .js к главному main.js.
Использую Gulp сборку
Дополнительно:
Ответы:
math.js
const add = (a, b) => { return a + b; }; const subtract = (a, b) => { return a - b; }; module.exports = { add, subtract }; |
const add = (a, b) => { return a + b; }; const subtract = (a, b) => { return a - b; }; module.exports = { add, subtract };
main.js
const math = require('./math.js');
В помощь
01:08:03 Работа с JavaScript (babel, webpack)
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы подключить код из файла .js в main.js через @@include, необходимо использовать препроцессор, который поддерживает данную функциональность, например, Gulp или Webpack.
В случае использования Gulp, вам необходимо установить плагин gulp-file-include с помощью npm:
```
npm install gulp-file-include --save-dev
```
После этого вам нужно создать файл gulpfile.js, где вы опишете задачу по подключению кода из файла .js в main.js:
```javascript
const gulp = require('gulp');
const fileinclude = require('gulp-file-include');
gulp.task('includeJS', function() {
return gulp.src('путь_к_вашему_файлу.js')
.pipe(fileinclude({
prefix: '@@',
basepath: '@file'
}))
.pipe(gulp.dest('путь_к_папке_где_находится_main.js'));
});
gulp.task('default', gulp.series('includeJS'));
```
После того как вы опишете эту задачу, вам нужно запустить Gulp:
```
gulp
```
После этого код из файла .js будет подключен в main.js с помощью @@include.
Если вы используете Webpack, то вам нужно будет настроить лоадер для файлов .js, который будет обрабатывать подключение кода из других файлов. Пример настройки лоадера для Webpack:
```javascript
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'file-include-loader'
}
}
]
}
```
После настройки лоадера, вы сможете подключать код из файлов .js в main.js через @@include.
Надеюсь, данная информация была полезной для вас. Если у вас остались вопросы, не стесняйтесь задавать их.