-
limit把圖片小于1024的轉(zhuǎn)成base64
查看全部 -
糾正上節(jié)課的寫法問題
查看全部 -
需要為vue這種類型的文件聲明一個(gè)loader
查看全部 -
entry不要拼錯(cuò)了，entry用來設(shè)置入口文件路徑
查看全部 -
調(diào)用方法在package文件中配置建立好的webpack指令需要這樣寫才能調(diào)用我們自己建立后的webpack文件
查看全部 -
output配置輸出的路徑filename是文件名path是輸出的文件夾
查看全部 -
entry是入口的配置將剛剛的入口文件打包
查看全部 -
構(gòu)建入口文件通過mount輸出到html里
查看全部 -
拼接絕對路徑dirname是根目錄路徑
查看全部 -
插件
查看全部 -
一、設(shè)置環(huán)境變量標(biāo)識(shí) 現(xiàn)在是開發(fā)環(huán)境還是正式環(huán)境??
涉及的包??cross-env
配置??cross-env?NODE_ENV=production? ? ? ??cross-env?NODE_ENV=development
"scripts":?{
????"build":?"cross-env?NODE_ENV=production?webpack?--config?webpack.config.js",
????"dev":?"cross-env?NODE_ENV=development?webpack-dev-server?--config?webpack.config.js"
??},
webpack.config.js中的配置
const?isDve?=?process.env.NODE_ENV?===?'development'
if(isDve)?{
????config.devServer?=?{
????????port:?8000,
????????host:?'0.0.0.0',
????????overlay:?{
????????????errors:?true,
????????}
????}
}
二、html-webpack-plugin 插件??
webpack.config.js中的配置
const?{VueLoaderPlugin}?=?require('vue-loader')
plugins:?[
????????new?HTMLPlugin()
????]
三、判斷環(huán)境、區(qū)分打包
const?{?webpack?}?=?require('webpack')
查看全部 -
css 預(yù)處理器 styl
?
查看全部 -
vscode插件安裝：
查看全部 -
一、webpack 打包優(yōu)化：
1、網(wǎng)絡(luò)優(yōu)化： 減少Http請求、壓縮靜態(tài)資源文件、使用瀏覽器的長緩存使應(yīng)用的流i量變得更小加載速度更快
二、
查看全部 -
包的配置查看全部 -
包的配置查看全部 -
相關(guān)包的配置查看全部 -
安裝的項(xiàng)目包，
查看全部 -
其它的loader的配置查看全部 -
package.json里面項(xiàng)目的配置查看全部 -
use:指需要什么樣的loader去編譯文件,這里由于源文件是.css所以選擇css-loader
fallback:編譯后用什么loader來提取css文件
publicfile:用來覆蓋項(xiàng)目路徑,生成該css文件的文件路徑查看全部 -
npm?init
npm?i?webpack?vue?vue-loader
npm?i?css-loader vue-template-compiler
查看全部 -
package.json按照視頻課程修改版本
并且
查看評論后一個(gè)一個(gè)自己嘗試，得到可以運(yùn)行的版本
{
? "name": "vue-todo",
? "version": "1.0.0",
? "description": "",
? "main": "index.js",
? "scripts": {
? ? "test": "echo \"Error: no test specified\" && exit 1",
? ? "build": "cross-env NODE_ENV=production webpack --config webpack.config.js",
? ? "dev": "cross-env NODE_ENV=development webpack-dev-server --config webpack.config.js"
? },
? "author": "",
? "license": "ISC",
? "dependencies": {
? ? "cross-env": "^5.1.3",
? ? "css-loader": "^0.28.7",
? ? "file-loader": "^1.1.6",
? ? "html-webpack-plugin": "^2.30.1",
? ? "style-loader": "^0.19.1",
? ? "stylus": "^0.54.5",
? ? "stylus-loader": "^3.0.1",
? ? "url-loader": "^0.6.2",
? ? "vue": "^2.5.13",
? ? "vue-loader": "^13.6.0",
? ? "vue-template-compiler": "^2.5.13",
? ? "webpack": "^3.1.0",
? ? "webpack-dev-server": "^2.9.1"
? },
? "devDependencies": {
? ? "webpack-dev-server": "^2.9.1"
? }
}
查看全部 -
插件
查看全部
舉報(bào)