(1) 在新建的資料夾my-com中執行以下命令
npm init
npm i rollup
npm i rollup-plugin-commonjs
npm i rollup-plugin-vue
npm i vue-template-compiler
要特別關注vue-template-compiler的版本,如果發布後使用這個元件時npm install 報錯,可能就是版本需要公升級了
(2).在資料夾my-com中建rollup.config.js、index.js 、lib檔案
rollup.config.js中配置入口出口檔案
input: './index.js',
output: ,
(3).package.json配置
"main": "lib/index.js",
"scripts": ,
執行 npm run prod,會自動生成乙個lib資料夾,裡面是打包後的index.js檔案,在其他專案通過node_modules引用這個元件時候,使用的就是lib下面的壓縮js
(4).將.vue元件發布到私庫
登入私庫後執行 npm publish
在其他專案裡修改這個元件的方法:
通過修改專案裡引node_modules中元件的路徑,預設是node_modules/my-com/lib/index.js,可以修改為node_modules/my-com/index.js就可以修改元件及時在專案中更新了
webpack打包 vue檔案
在webpack中配置.vue元件頁面的解析 vue loader 1 執行npm i vue s將vue安裝為執行依賴 2 運cnpm i vue loader vue template compiler d將解析轉換vue的包安裝為開發依賴 3 執行npm i style loader css ...
webpack 打包檔案 vue 過大
在 build webpack.base.conf.js 檔案裡加上 externals 不需要打包的檔案就放寫在這裡,然後在 index.html 外連上這些庫 順便記錄乙個連線後面加入版本號 在 webpack.prod.conf.js 檔案裡 自己獲取乙個時間加在後面就可以了 官方 impor...
vue使用npm run build命令打包
在本地除錯的時候只要命令列執行npm run dev就可以把這個專案跑起來,但是現在我們要把他放到伺服器上的話需要npm run build命令 1.win r 輸入 cmd 2.進入專案檔案 如 d盤 下的 vue demo 如下操作 d 進入d盤 cd vue demo 進入資料夾 執行npm ...