ईएस 6 आयात के माध्यम से फाउंडेशन 6 जेएस फाइलों को कैसे शामिल करें?

Question

मैं अपने जेएस संकलित करने के लिए ब्राउजरिफ़ + बेबेलिफ़ाई के साथ गल्प का उपयोग कर रहा हूं।

मेरे काम की तरह लग रहा है कि:

import config from '../config.json'; 

import gulp from 'gulp'; 
import browserify from 'browserify'; 
import babelify from 'babelify' 
import browserSync from 'browser-sync'; 
import babel from 'gulp-babel'; 
import source from 'vinyl-source-stream'; 


function onError(error) { 
    console.log(error.toString()); 
    this.emit('end'); 
} 

export function dev() { 
    return browserify({ 
     entries: 'src/js/main.js', 
     debug: true, 
     extensions: ['.js', '.json', '.es6'] 
    }) 
     .transform(babelify) 
     .bundle() 
     .on('error', onError) 
     .pipe(source('main.js')) 
     .pipe(gulp.dest('public/js')) 
     .pipe(browserSync.stream()); 
} 


gulp.task('js:dev', dev); 

src/js/main.js में मैं आयात फाउंडेशन जे एस मॉड्यूल में कोशिश कर रहा हूँ। इस फ़ाइल में केवल एक ही लाइन होते हैं:

import 'foundation-sites/js/foundation.util.motion'; 

संकलन मैं गैर संकलित करने के नींव मॉड्यूल के बाद कुछ browserify और babelify कोड के साथ:

लेकिन! मैं node_modules से src फ़ोल्डर में फाइल कॉपी करने की कोशिश की और इसे आयात:

import './inc/app'; 

और इस मामले अल में ठीक काम करता है:

क्यों? जादू क्या है? सही तरीका क्या होगा?

Answer 1

समस्या यह है कि आप नींव-साइट पैकेज की स्रोत फ़ाइल आयात करने का प्रयास कर रहे हैं। आपको node-modules/foundation-sites/dist/plugins/foundation.util.motion पर पहले से मौजूद बंडल संस्करण या एकल स्रोत फ़ाइल का उपयोग करना होगा।

फिर इस के साथ अपने आयात की जगह है और यह काम करेगा:

import 'foundation-sites/dist/plugins/foundation.util.motion';