×ðÁú¿­Ê±

Laravel¿ª·¢£ºÔõÑùʹÓÃLaravel Mix±àдCSSºÍJavaScript£¿

laravel¿ª·¢£ºÔõÑùʹÓÃlaravel mix±àдcssºÍjavascript£¿

Laravel MixÊÇLaravel¿ò¼ÜÄÚÖõÄÒ»¿î¹¹½¨¹¤¾ß£¬¿ÉÓÃÓÚ±àдºÍ´ò°üCSS¡¢JavaScript¡¢Í¼Æ¬µÈÇ°¶Ë×ÊÔ´£¬ÒÔ¼°ÓÅ»¯×Ô¶¯¼ÓÔغͱàÒëµÈ¹¦Ð§£¬Ê¹¿ª·¢Ö°Ô±Äܹ»¸üÇáËɵØÖÎÀíºÍ¹¹½¨Ç°¶Ë×ÊÔ´ ¡£

ÔÚ±¾ÎÄÖУ¬ÎÒÃǽ«Ò»²½²½Ñ§Ï°ÔõÑùʹÓÃLaravel Mix±àдCSSºÍJavaScript ¡£

×°ÖÃLaravel Mix

ÔÚ×îÏÈʹÓÃLaravel Mix±àдCSSºÍJavaScript֮ǰ£¬Ê×ÏÈÐèÒªÔÚLaravelÏîÄ¿ÖÐ×°ÖÃLaravel Mix ¡£Äú¿ÉÒÔʹÓÃÒÔÏÂÏÂÁ

Á¬Ã¦Ñ§Ï°¡°JavaÃâ·ÑѧϰÌõ¼Ç£¨ÉîÈ룩¡±£»

npm install
npm install laravel-mix --save-dev

µÇ¼ºó¸´ÖÆ

Õ⽫װÖÃLaravel Mix¼°ÆäÒÀÀµÏî ¡£

±àдCSS

Laravel MixÌṩÁËÐí¶àÀû±ãµÄÒªÁìÀ´±àдCSS ¡£Äú¿ÉÒÔʹÓÃCSSµÄ±àÒëÆ÷£¬ÀýÈçSass»òLess£¬À´Ê¹CSS¸ü¾ß¿É¶ÁÐÔ ¡£±ðµÄ£¬Laravel Mix»¹ÌṩÁËһЩÓÐÓõÄÒªÁ죬ÀýÈç×Ô¶¯Ìí¼ÓCSSǰ׺ÒÔ¼°Ñ¹ËõºÍÓÅ»¯CSS ¡£

ÒÔÏÂÊÇʹÓÃLaravel Mix±àдCSSµÄʾÀý´úÂ룺

// µ¼ÈëLaravel Mix
const mix = require('laravel-mix');
// ±àÒë²¢´ò°üCSS
mix.sass('resources/sass/app.scss', 'public/css')
// ×Ô¶¯Ìí¼ÓCSSǰ׺
.options({
    postCss: [
        require('autoprefixer')({
            browsers: ['last 3 versions', 'iOS >= 8', 'Safari >= 8']
        })
    ]
})
// ѹËõºÍÓÅ»¯CSS
.minify('public/css/app.css');

µÇ¼ºó¸´ÖÆ

ÔÚÉÏÃæµÄ´úÂëÖУ¬ÎÒÃÇʹÓÃÁËSass±àдCSS£¬²¢½«Æä±àÒëΪCSS£¬È»ºó½«Æä´ò°üµ½public/cssĿ¼ÖÐ ¡£ÎÒÃÇ»¹Ê¹ÓÃÁË×Ô¶¯Ìí¼ÓCSSǰ׺À´È·±£CSSÔÚÖÖÖÖä¯ÀÀÆ÷ÉϾßÓÐÒ»ÖµÄÍâ¹Û£¬²¢Ñ¹ËõºÍÓÅ»¯ÁËCSSÒÔÌá¸ßÒ³Ãæ¼ÓÔØËÙÂÊ ¡£

±àдJavaScript

Laravel Mix»¹ÌṩÁËÐí¶àÀû±ãµÄÒªÁìÀ´±àдJavaScript ¡£Äú¿ÉÒÔʹÓÃBabelÀ´×ª»»ES6»ò¸ü¸ß°æ±¾µÄJavaScript£¬ÒÔÈ·±£´úÂë¿ÉÔÚÖÖÖÖä¯ÀÀÆ÷ÖÐÔËÐÐ ¡£±ðµÄ£¬Laravel Mix»¹ÌṩÁËһЩÓÐÓõÄÒªÁ죬ÀýÈçѹËõºÍÓÅ»¯JavaScript ¡£

ÒÔÏÂÊÇʹÓÃLaravel Mix±àдJavaScriptµÄʾÀý´úÂ룺

// µ¼ÈëLaravel Mix
const mix = require('laravel-mix');
// ±àÒë²¢´ò°üJavaScript
mix.js('resources/js/app.js', 'public/js')
// ת»»ES6»ò¸ü¸ß°æ±¾µÄJavaScript
.babel('public/js/app.js', 'public/js')
// ѹËõºÍÓÅ»¯JavaScript
.minify('public/js/app.js');

µÇ¼ºó¸´ÖÆ

ÔÚÉÏÃæµÄ´úÂëÖУ¬ÎÒÃÇʹÓÃÁËBabelÀ´×ª»»ES6»ò¸ü¸ß°æ±¾µÄJavaScript£¬²¢½«±àÒëµÄJavaScript´ò°üµ½public/jsĿ¼ÖÐ ¡£ÎÒÃÇ»¹Ñ¹ËõºÍÓÅ»¯ÁËJavaScriptÒÔÌá¸ßÒ³Ãæ¼ÓÔØËÙÂÊ ¡£

×ܽá

±¾ÎÄÏÈÈÝÁËÔõÑùʹÓÃLaravel Mix±àдCSSºÍJavaScript ¡£ÎÒÃÇѧϰÁËÔõÑùʹÓÃSass±àдCSS£¬ÔõÑùʹÓÃBabelת»»JavaScript£¬²¢ÔõÑù×Ô¶¯Ìí¼ÓCSSǰ׺¡¢Ñ¹ËõºÍÓÅ»¯CSSºÍJavaScript ¡£Laravel MixÊÇÒ»¸öºÜÊÇÇ¿Ê¢µÄ¹¤¾ß£¬Ëü¿ÉÒÔ×ÊÖúÎÒÃǸüÇáËɵØÖÎÀíºÍ¹¹½¨Ç°¶Ë×ÊÔ´ ¡£ÈôÊÇÄúÕýÔÚʹÓÃLaravel¾ÙÐпª·¢£¬ÄÇôǿÁÒ½¨ÒéÄúʹÓÃLaravel MixÀ´ÖÎÀíºÍ±àÒëÇ°¶Ë×ÊÔ´ ¡£

ÒÔÉϾÍÊÇLaravel¿ª·¢£ºÔõÑùʹÓÃLaravel Mix±àдCSSºÍJavaScript£¿µÄÏêϸÄÚÈÝ£¬¸ü¶àÇë¹Ø×¢±¾ÍøÄÚÆäËüÏà¹ØÎÄÕ£¡

ÃâÔð˵Ã÷£ºÒÔÉÏչʾÄÚÈÝȪԴÓÚÏàÖúýÌå¡¢ÆóÒµ»ú¹¹¡¢ÍøÓÑÌṩ»òÍøÂçÍøÂçÕûÀí£¬°æȨÕùÒéÓë±¾Õ¾Î޹أ¬ÎÄÕÂÉæ¼°¿´·¨Óë¿´·¨²»´ú±í×ðÁú¿­Ê±ÂËÓÍ»úÍø¹Ù·½Ì¬¶È£¬Çë¶ÁÕß½ö×ö²Î¿¼ ¡£±¾ÎĽӴýתÔØ£¬×ªÔØÇë˵Ã÷À´ÓÉ ¡£ÈôÄúÒÔΪ±¾ÎÄÇÖÕ¼ÁËÄúµÄ°æȨÐÅÏ¢£¬»òÄú·¢Ã÷¸ÃÄÚÈÝÓÐÈκÎÉæ¼°ÓÐÎ¥¹«µÂ¡¢Ã°·¸Ö´·¨µÈÎ¥·¨ÐÅÏ¢£¬ÇëÄúÁ¬Ã¦ÁªÏµ×ðÁú¿­Ê±ÊµÊ±ÐÞÕý»òɾ³ý ¡£

Ïà¹ØÐÂÎÅ

ÁªÏµ×ðÁú¿­Ê±

18523999891

¿É΢ÐÅÔÚÏß×Éѯ

ÊÂÇéʱ¼ä£ºÖÜÒ»ÖÁÖÜÎ壬9:30-18:30£¬½ÚãåÈÕÐÝÏ¢

QR code
¡¾ÍøÕ¾µØͼ¡¿¡¾sitemap¡¿