⑴ 請教各位mvc的js打包壓縮有關的問題
1.引用js文件,如果有.min.js和.js文件 最好只引用.js文件 而不去引用.min.js文件,因為系統在Release之後會自動去查找相應的.min.js文件的 而在debug時會引用.js文件 這樣方便調試
2.確定文件是否存在,如果不存在,知道怎麼改了吧??
3.我發現樓主還不了解BundleConfig的使用方法。
new StyleBundle("綁定實例名") 這里明明是名稱,但為什麼這名稱看起來像路徑
比如你這里的 new StyleBundle("~/Index/css_easyui")
為什麼會像路徑??
這是有原因的
當你在Release之後 BundleConfig會把你這個Include中的所有文件進行壓縮成一個文件,但這個文件的路徑是什麼,就是這個"綁定實例名"
也就是說 在這里,當你Release之後 你的css將會生成 <link type="text/css" rel="stylesheet" href="~/Index/css_easyui?隨機數"/>
接著說:
如果 你的css文件~/Content/Css/themes/icon.css裡面有句話:
.cls
{
background-image:url(../img/xxxx.gif);
}
發現問題沒有呢? 在Release之前
這個背景圖的路徑是:~/Content/Css/img/xxxx.gif
而在Release之後 因為你的css文件已經整合到了~/Index/css_easyui?隨機數這個文件裡面
所以Release之後這個圖片路徑卻變成了:~/img/xxxx.gif
⑵ 把vars.js壓縮為vars.rar壓縮文件怎麼操作
利用winrar軟體
1、打開需要壓縮的圖片文件,選中vars.js後,右擊,選擇「添加到壓縮文件」。
2、軟體彈出,壓縮文件的提示對話框,在該對話框中可以設置「壓縮的文件名,和壓縮的文件格式比如(RAR,RAR5,ZIP等)還可以選擇其壓縮方式」。成功設置後,點擊「確定」。
3、在當前活動窗口可以看到,已經壓縮成功了,並能查看。
⑶ 怎麼用gulp壓縮js和css文件
/步驟
首先要確保pc裝nodeglobal環境項目文件都install gulp
npm install gulp -g (global環境)
npm install gulp --save-dev (項目環境)
項目install需要gulp插件般壓縮需要
npm install gulp-minify-css gulp-concat gulp-uglify gulp-rename del --save-dev
更插件鏈接找
項目根目錄新建gulpfile.jsrequire需要mole
var gulp = require('gulp'),
minifycss = require('gulp-minify-css'),
concat = require('gulp-concat'),
uglify = require('gulp-uglify'),
rename = require('gulp-rename'),
del = require('del');
壓縮css
gulp.task('minifycss', function() {
return gulp.src('src/*.css') //壓縮文件
.pipe(gulp.dest('minified/css')) //輸文件夾
.pipe(minifycss()); //執行壓縮
});
壓縮js
gulp.task('minifyjs', function() {
return gulp.src('src/*.js')
.pipe(concat('main.js')) //合並所jsmain.js
.pipe(gulp.dest('minified/js')) //輸main.js文件夾
.pipe(rename({suffix: '.min'})) //rename壓縮文件名
.pipe(uglify()) //壓縮
.pipe(gulp.dest('minified/js')); //輸
});
執行壓縮前先刪除文件夾內容
gulp.task('clean', function(cb) {
del(['minified/css', 'minified/js'], cb)
});
默認命令cmd輸入gulp執行命令
gulp.task('default', ['clean'], function() {
gulp.start('minifycss', 'minifyjs');
});
要cmd執行gulp即
⑷ 網站優化:所有的js代碼放到同一個js文件中好,還是不同的頁面根據需要創建不同的js文件好
網站優化:一個是壓縮合並css,js,一個是合並圖片和小圖標來達到減少請求量的目的;所以當然是所有的js代碼放到同一個js文件中好;需要注意的是:
1、只要命名不沖突放一個文件裡面完全沒問題,初始化代碼用一個$(function(){...})包裹著就可以了;
2、不同的頁面執行不同的邏輯代碼塊完全不沖突,關鍵是知道自己在做什麼;
具體做法:
1)比如a.css,b.css,c.css,把裡面的內容都復制到一個css中,main.css這樣手動就可以合並
壓縮的話,網上都有工具來壓縮,直接網路 css壓縮 就可以了;
2)js大部分是可以直接和css一樣手動合並,然後壓縮的(壓縮方法,和壓縮css一樣,網路去),不過要注意復制到文件時的順序,和代碼裡面的一些規范,不要把依賴什麼的搞混了;如果js文件非常多手動處理很麻煩的時候,可能需要藉助工具來實現,你可以試著用前端的一些載入器(require,seajs)來做一些優化,達到按需載入的目的,推薦用seajs試試;自動壓縮的話,可以用nodejs的grunt來壓縮,很好用。
⑸ 百度js和css合並壓縮是如何做的
簡單來說是通過插件實現,當然現在淘寶出的伺服器(nginx修改版)自帶有這個功能。 通過一個url地址里寫上每個js或者css 路徑,然後插件通過路徑將js/css 進行gzip形式壓縮,最後組合成一個文件輸出。你能看到的輸出格式是php後綴,但是輸出文件的表頭是js/CSS 這樣瀏覽器也就當是js/css來解析了。
合並代碼工具我推薦minify (PHP),這個比較早,也很簡單。
壓縮的話網上有很多地方都提供在線壓縮
簡單說說 JS壓縮:
1. 長變數變數名 壓縮為短變數名,去空格,去注釋
2. 可以將 new Array() 改寫為 [], new Object 改寫為{} 雲雲
3. 使用eval, 關鍵詞等等 的復雜邏輯 也可以壓縮
這樣處理過後,如果覺得還是太大了,還可以採用服務端的gzip壓縮傳輸
⑹ JS中如何用r.js對js進行合並和壓縮css文件
呃,用js來壓縮文件?
這個可就復雜了,但首先得理清思路
合並,合並就是將兩個文件的內容合在一起放到一個文件裡面去,js好像還沒這么先進
壓縮,css壓縮其實就是將換行和空格清除,這個js可以做到,但獲取一個文件保存文件,這個js做不到,同上1一樣,沒那麼先進
⑺ gulp怎麼壓縮html js css 混合的文件
合並和壓縮JS、CSS文件
壓縮JS,CSS文件需要引用如下組件:
gulp-minify-css: 壓縮css
gulp-jshint: 檢查js
gulp-uglify: 壓縮js
gulp-concat: 合並文件
gulp-rename: 重命名文件
gulp-clean: 清空文件夾
gulp-notify:提示
安裝組件項目目錄,通過cd 進入項目的根目錄,執行下邊的npm安裝組件
npm install gulp-minify-css gulp-jshint gulp-uglify gulp-rename gulp-concat gulp-clean gulp-notify --save-dev
⑻ js文件 壓縮成一個 是怎麼弄的
gulp + webpack/browserify
用gulp加上webpack或者browserify來完成。js之間使用require相互引用,然後在gulpfile裡面設置把所有文件整合輸出並uglify
⑼ 為什麼用gulp把多個js文件合並壓縮後,再直接引入頁面就報錯了
合並成一個JS文件之後,代碼的作用域擴大,難免會造成沖突。找到報錯的代碼所在位置,找到原JS文件修改下。
舉個例子:a.js 中有var foo = 1; b.js 中也有 var foo = 10; 那麼合並之後就會有兩個 foo 變數, 這樣一來在新的js文件中,foo的值就是寫在後面的一個,而恰好後面的值會沖突報錯。
因此,在合並之前需要確定每個js文件都能正常工作,而且沒有函數、變數上的沖突。