Как исправить «Файл для импорта не найден или не читается: функции.»? - PullRequest
Новая
       53

Как исправить «Файл для импорта не найден или не читается: функции.»?

0 голосов
/ 03 мая 2019

Я использую webpack-4, gulp-sass, node-sass и express. Когда я пытаюсь создать свой сайт, я получаю сообщение об ошибке. Кажется, он не может найти каталог node_modules, локальный для моего проекта. Что я делаю не так?

Если я изменю оператор импорта из функции "@import" ";" в "@import" / node_modules / bootstrap / scss / functions "; ошибка исчезла. 

\\ webpack.config.js
const path = require('path')

module.exports = {
    entry: path.resolve(__dirname, './src/app.js'),
    mode: 'none',
    output: {
        filename: 'main.min.js',
        path: path.resolve(
            __dirname,
            './src/js/'
        ),
    },
}

\\ gulp-config.js
module.exports = {
  projectURL: 'localhost:3000',
  browserAutoOpen: false,
  injectChanges: true,
  sass: {
      src: './src/sass/main.scss',
      dest: './src/public/css/',
      watchDirectory: './src/sass/**/*.scss',
  },
  js: {
      src: './src/js/**/*.js',
      dest: './src/js/',
      watchDirectory: './src/js/**/*.js',
      ignoredFiles: './src/js/main.min.js',
  },
}

\\ Excerpt from main.scss
@import "functions";
@import "variables";


\\ gulpfile.js
const gulp = require('gulp');
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const browserSync = require('browser-sync');
const plumber = require('gulp-plumber');
const webpack = require('webpack');
const webpackstream = require('webpack-stream');
const webpackconfig = require('./webpack.config.js');

sass.compiler = require('node-sass');
const config = require('./gulp-config.js');

// Browsersync
const browsersync = (done) => {
    browserSync.init({
        proxy: config.projectURL,
        open: config.browserAutoOpen,
        injectChanges: config.injectChanges,
        watchEvents: [ 'change', 'add', 'unlink', 'addDir', 'unlinkDir' ]
    });
    done();
};

// Helper function to allow browser reload with Gulp 4.
const reloadBrowsers = (done) => {
    browserSync.reload();
    done();
};

// Minifiers
gulp.task('sass', () =>
    gulp
        .src(config.sass.src)
        .pipe(sourcemaps.init())
        .pipe(sass().on('error', sass.logError))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(config.sass.dest))
);

gulp.task('js', () =>
    gulp
        .src([ config.js.src ])
        .pipe(plumber())
        .pipe(webpackstream(webpackconfig, webpack))
        .pipe(gulp.dest(config.js.dest))
);

// Watcher
gulp.task('watch', () => {
    gulp.watch(config.sass.watchDirectory, { usePolling: true }, gulp.series('sass', reloadBrowsers));
    gulp.watch(
        config.js.watchDirectory,
        {
            usePolling: true,
            ignored: config.js.ignoredFiles
        },
        gulp.series('js', reloadBrowsers)
    );
});

// Default
gulp.task('default', gulp.parallel('sass', 'js', browsersync, 'watch'));
...