react+webpack 打包，開發環境和生產環境整合一體拿來就能用
直接上程式碼：
webpack.config.js
import webpack from "webpack";
import path from "path";
var path = path.resolve(__dirname,"/main.j")
var ExtractTextPlugin = require("extract-text-webpack-plugin");//css,js分離外掛,
//使用該外掛需要獨立下載'npm install extract-text-webpack-plugin --save-dev', 同時下面的rules也必須更改
var CleanWebpackPlugin = require("clean-webpack-plugin");//要清除重複打包的檔案重複問題
// 需要先進行安裝 npm install --save-dev html-webpack-plugin inline-menifest-webpack-plugin
var HtmlWebpackPlugin = require("html-webpack-plugin");//動態將打包好的js css檔案注入到index.html
var InlineMenifestWebpackPlugin = require("inline-menifest-webpack-plugin");//動態將打包好的js css檔案注入到index.html
var isProduction = process.env.NODE_ENV === 'production';
var filename = isProduction ? '[name].[chunkhash].js':'[name].js';
module.exports={
entry: {
main: ".src/main.j",
// ventor: ['jquery']
},
output:{
path: path.resolve(__dirname, './build'),
filename: filename//根據模組內容計算雜湊值
},
module : {
// npm install babel-loader babel babel-core css-loader sass-loader style-loader url-loader file-loader less-loader less --save-dev
rules: [
// npm install --save-dev babel-preset-es2015
// npm install --save-dev babel-preset-react
// npm install babel-loader --save-dev
// npm install babel-core --save-dev
// npm install babel-preset-es2015 --save
// npm install --save-dev babel-preset-react
// npm install --save-dev jsx-loader
{
test: /\.(js|jsx)$/,
loader: 'babel-loader',
exclude: /node_modules/, //不進行轉換的檔案，可以提高打包速度
},
{
test:/\.sass$/,
use:ExtractTextPlugin.extract({
use:[{
loader:'css-loader',
options:{
minimize: isProduction
}
},
'sass-loader'
],
fallback:'style-loader'
})
},
{test: /\.css$/, use: ['style-loader', 'css-loader']},/*解析css, 並把css新增到html的style標籤裡*/
{test: /\.less$/, use: ['style-loader', 'css-loader', 'less-loader']},/*解析less, 把less解析成瀏覽器可以識別的css語言*/
{
test: /\.(jpe?g|png|gif|svg)$/,
use: {
limit:8192,
name:'[name].[hashs].[ext]',
outputPath: 'images/'
}
},/*解析圖片*/
{test: /\.(woff|woff2|eot|ttf|otf)$/,use: ['file-loader']}//解析文字
]
},
resolve: {
extensions: ['jsx', '.js', '.json', '.css','.scss']
},
plugins: [
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('production')
}),
new webpack.BannerPlugin('翻版必究'),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
// new webpack.optimize.CommonsChunkPlugin('node_modules'),//把公共模組提取出來, 並取名為'common'(名字自起), webpack之後再out資料夾下生成common.js, 測試時記得引入提取出來的公共模組js檔案,
new ExtractTextPlugin('[name].css'),
new webpack.ProvidePlugin({$: 'jquery', jQuery: 'jquery', 'window.jQuery': 'jquery'}),//引入jquery
// 要清除重複打包的檔案重複問題
new CleanWebpackPlugin(['build'],{
root: _dirname,
verbose: true,
dry: false
}),
new HtmlWebpackPlugin({
template: 'webpackManifest'
}),
new InlineManifestWebpackPlugin({
name: 'webpackManifest'
})
]
};
if(isProduction){//只有在生產環境下，才需要進行壓縮
module.exports.plugins.push(
new webpack.optimize.UglifyJsPlugin({minimize: true}),//js程式碼壓縮,
)
}
package.json:
{
"devDependencies": {
"babel": "^6.23.0",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"css-loader": "^1.0.0",
"file-loader": "^1.1.11",
"less": "^3.8.1",
"less-loader": "^4.1.0",
"style-loader": "^0.22.1",
"url-loader": "^1.0.1",
"webpack": "^4.16.5",
"webpack-cli": "^3.1.0"
},
"name": "wp-demo",
"version": "1.0.0",
"private": true,
"dependencies": {
"[email protected]@acorn-dynamic-import": "^3.0.0",
"[email protected]@acorn": "^5.7.1",
"[email protected]@ajv-keywords": "^3.2.0",
"[email protected]@ajv": "^6.5.2",
"[email protected]@anymatch": "^2.0.0",
"[email protected]@aproba": "^1.2.0",
"[email protected]@arr-flatten": "^1.1.0",
"[email protected]@arr-diff": "^4.0.0",
"[email protected]@arr-union": "^3.1.0",
"[email protected]@array-unique": "^0.3.2",
"[email protected]@assert": "^1.4.1",
"[email protected]@asn1.js": "^4.10.1",
"[email protected]@assign-symbols": "^1.0.0",
"[email protected]@async-each": "^1.0.1",
"[email protected]@atob": "^2.1.1",
"[email protected]@balanced-match": "^1.0.0",
"[email protected]@base": "^0.11.2",
"[email protected]@base64-js": "^1.3.0",
"[email protected]@big.js": "^3.2.0",
"[email protected]@binary-extensions": "^1.11.0",
"[email protected]@bluebird": "^3.5.1",
"[email protected]@bn.js": "^4.11.8",
"[email protected]@brace-expansion": "^1.1.11",
"[email protected]@braces": "^2.3.2",
"[email protected]@brorand": "^1.1.0",
"[email protected]@browserify-cipher": "^1.0.1",
"[email protected]@browserify-des": "^1.0.2",
"[email protected]@browserify-rsa": "^4.0.1",
"[email protected]@browserify-sign": "^4.0.4",
"[email protected]@browserify-aes": "^1.2.0",
"[email protected]@browserify-zlib": "^0.2.0",
"[email protected]@buffer-from": "^1.1.1",
"[email protected]@buffer-xor": "^1.0.3",
"[email protected]@builtin-status-codes": "^3.0.0",
"[email protected]@cacache": "^10.0.4",
"[email protected]@cache-base": "^1.0.1",
"[email protected]@chokidar": "^2.0.4",
"[email protected]@buffer": "^4.9.1",
"[email protected]@chownr": "^1.0.1",
"[email protected]@chrome-trace-event": "^1.0.0",
"[email protected]@cipher-base": "^1.0.4",
"[email protected]@collection-visit": "^1.0.0",
"[email protected]@commander": "^2.13.0",
"[email protected]@commondir": "^1.0.1",
"[email protected]@component-emitter": "^1.2.1",
"[email protected]@concat-map": "^0.0.1",
"[email protected]@class-utils": "^0.3.6",
"[email protected]@concat-stream": "^1.6.2",
"[email protected]@console-browserify": "^1.1.0",
"[email protected]@constants-browserify": "^1.0.0",
"[email protected]@copy-concurrently": "^1.0.5",
"[email protected]@copy-descriptor": "^0.1.1",
"[email protected]@core-util-is": "^1.0.2",
"[email protected]@create-ecdh": "^4.0.3",
"[email protected]@create-hash": "^1.2.0",
"[email protected]@create-hmac": "^1.1.7",
"[email protected]@cyclist": "^0.2.2",
"[email protected]@crypto-browserify": "^3.12.0",
"[email protected]@date-now": "^0.1.4",
"[email protected]@debug": "^2.6.9",
"[email protected]@debug": "^3.1.0",
"[email protected]@decode-uri-component": "^0.2.0",
"[email protected]@define-property": "^0.2.5",
"[email protected]@define-property": "^1.0.0",
"[email protected]@define-property": "^2.0.2",
"[email protected]@des.js": "^1.0.0",
"[email protected]@domain-browser": "^1.2.0",
"[email protected]@diffie-hellman": "^5.0.3",
"[email protected]@duplexify": "^3.6.0",
"[email protected]@elliptic": "^6.4.1",
"[email protected]@emojis-list": "^2.1.0",
"[email protected]@end-of-stream": "^1.4.1",
"[email protected]@enhanced-resolve": "^4.1.0",
"[email protected]@errno": "^0.1.7",
"[email protected]@eslint-scope": "^4.0.0",
"[email protected]@esrecurse": "^4.2.1",
"[email protected]@estraverse": "^4.2.0",
"[email protected]@events": "^1.1.1",
"[email protected]@evp_bytestokey": "^1.0.3",
"[email protected]@expand-brackets": "^2.1.4",
"[email protected]@extend-shallow": "^3.0.2",
"[email protected]@extglob": "^2.0.4",
"[email protected]@fast-deep-equal": "^2.0.1",
"[email protected]@fast-json-stable-stringify": "^2.0.0",
"[email protected][email protected]": "^2.0.1",
"[email protected]@fill-range": "^4.0.0",
"[email protected]@find-cache-dir": "^1.0.0",
"[email protected]@find-up": "^2.1.0",
"[email protected]@flush-write-stream": "^1.0.3",
"[email protected]@for-in": "^1.0.2",
"[email protected]@fragment-cache": "^0.2.1",
"[email protected]@from2": "^2.3.0",
"[email protected]@fs-write-stream-atomic": "^1.0.10",
"[email protected]@fs.realpath": "^1.0.0",
"[email protected]@fsevents": "^1.2.4",
"[email protected]@get-value": "^2.0.6",
"[email protected]@graceful-fs": "^4.1.11",
"[email protected]@glob": "^7.1.2",
"[email protected]@has-value": "^0.3.1",
"[email protected]@glob-parent": "^3.1.0",
"[email protected]@has-value": "^1.0.0",
"[email protected]@has-values": "^0.1.4",
"[email protected]@has-values": "^1.0.0",
"[email protected]@hash-base": "^3.0.4",
"[email protected]@hash.js": "^1.1.5",
"[email protected]@hmac-drbg": "^1.0.1",
"[email protected]@https-browserify": "^1.0.0",
"[email protected]@ieee754": "^1.1.12",
"[email protected]@iferr": "^0.1.5",
"[email protected]@imurmurhash": "^0.1.4",
"[email protected]@indexof": "^0.0.1",
"[email protected]@inflight": "^1.0.6",
"[email protected]@inherits": "^2.0.1",
"[email protected]@inherits": "^2.0.3",
"[email protected]@is-accessor-descriptor": "^0.1.6",
"[email protected]@is-accessor-descriptor": "^1.0.0",
"[email protected]@is-binary-path": "^1.0.1",
"[email protected]@is-buffer": "^1.1.6",
"[email protected]@is-data-descriptor": "^0.1.4",
"[email protected]@is-data-descriptor": "^1.0.0",
"[email protected]@is-descriptor": "^0.1.6",
"[email protected]@is-extendable": "^0.1.1",
"[email protected]@is-extendable": "^1.0.1",
"[email protected]@is-extglob": "^2.1.1",
"[email protected]@is-glob": "^3.1.0",
"[email protected]@is-glob": "^4.0.0",
"[email protected]@is-number": "^3.0.0",
"[email protected]@is-plain-object": "^2.0.4",
"[email protected]@is-windows": "^1.0.2",
"[email protected]@isobject": "^2.1.0",
"[email protected]@isarray": "^1.0.0",
"[email protected]@isobject": "^3.0.1",
"[email protected]@is-descriptor": "^1.0.2",
"[email protected]@json-parse-better-errors": "^1.0.2",
"[email protected]@json-schema-traverse": "^0.4.1",
"[email protected]@json5": "^0.5.1",
"[email protected]@kind-of": "^4.0.0",
"[email protected]@kind-of": "^3.2.2",
"[email protected]@kind-of": "^5.1.0",
"[email protected]@kind-of": "^6.0.2",
"[email protected]@loader-runner": "^2.3.0",
"[email protected]@loader-utils": "^1.1.0",
"[email protected]@locate-path": "^2.0.0",
"[email protected]@lodash.debounce": "^4.0.8",
"[email protected]@long": "^3.2.0",
"[email protected]@lru-cache": "^4.1.3",
"[email protected]@long": "^4.0.0",
"[email protected]@mamacro": "^0.0.3",
"[email protected]@make-dir": "^1.3.0",
"[email protected]@map-cache": "^0.2.2",
"[email protected]@map-visit": "^1.0.0",
"[email protected]@md5.js": "^1.3.4",
"[email protected]@memory-fs": "^0.4.1",
"[email protected]@micromatch": "^3.1.10",
"[email protected]@miller-rabin": "^4.0.1",
"[email protected]@minimalistic-assert": "^1.0.1",
"[email protected]@minimalistic-crypto-utils": "^1.0.1",
"[email protected]@minimatch": "^3.0.4",
"[email protected]@minimist": "^0.0.8",
"[email protected]@mississippi": "^2.0.0",
"[email protected]@mkdirp": "^0.5.1",
"[email protected]@move-concurrently": "^1.0.1",
"[email protected]@mixin-deep": "^1.3.1",
"[email protected]@ms": "^2.0.0",
"[email protected]@nanomatch": "^1.2.13",
"[email protected]@neo-async": "^2.5.1",
"[email protected]@node-libs-browser": "^2.1.0",
"[email protected]@normalize-path": "^2.1.1",
"[email protected]@object-copy": "^0.1.0",
"[email protected]@object-visit": "^1.0.1",
"[email protected]@object.pick": "^1.3.0",
"[email protected]@once": "^1.4.0",
"[email protected]@os-browserify": "^0.3.0",
"[email protected]@p-limit": "^1.3.0",
"[email protected]@p-locate": "^2.0.0",
"[email protected]@p-try": "^1.0.0",
"[email protected]@pako": "^1.0.6",
"[email protected]@parse-asn1": "^5.1.1",
"[email protected]@pascalcase": "^0.1.1",
"[email protected]@path-browserify": "^0.0.0",
"[email protected]@path-dirname": "^1.0.2",
"[email protected]@path-exists": "^3.0.0",
"[email protected]@path-is-absolute": "^1.0.1",
"[email protected]@pbkdf2": "^3.0.16",
"[email protected]@pify": "^3.0.0",
"[email protected]@pkg-dir": "^2.0.0",
"[email protected]@posix-character-classes": "^0.1.1",
"[email protected]@process-nextick-args": "^2.0.0",
"[email protected]@process": "^0.11.10",
"[email protected]@promise-inflight": "^1.0.1",
"[email protected]@prr": "^1.0.1",
"[email protected]@parallel-transform": "^1.1.0",
"[email protected]@public-encrypt": "^4.0.2",
"[email protected]@pump": "^2.0.1",
"[email protected]@pumpify": "^1.5.1",
"[email protected]@punycode": "^1.3.2",
"[email protected]@punycode": "^1.4.1",
"[email protected]@punycode": "^2.1.1",
"[email protected]@querystring-es3": "^0.2.1",
"[email protected]@querystring": "^0.2.0",
"[email protected]@pseudomap": "^1.0.2",
"[email protected]@randomfill": "^1.0.4",
"[email protected]@readable-stream": "^2.3.6",
"[email protected]@readdirp": "^2.1.0",
"[email protected]@regex-not": "^1.0.2",
"[email protected]@remove-trailing-separator": "^1.1.0",
"[email protected]@repeat-element": "^1.1.2",
"[email protected]@repeat-string": "^1.6.1",
"[email protected]@resolve-url": "^0.2.1",
"[email protected]@ret": "^0.1.15",
"[email protected]@rimraf": "^2.6.2",
"[email protected]@ripemd160": "^2.0.2",
"[email protected]@run-queue": "^1.0.3",
"[email protected]@safe-buffer": "^5.1.2",
"[email protected]@safe-regex": "^1.1.0",
"[email protected]@schema-utils": "^0.4.7",
"[email protected]@serialize-javascript": "^1.5.0",
"[email protected]@set-immediate-shim": "^1.0.1",
"[email protected]@set-value": "^0.4.3",
"[email protected]@set-value": "^2.0.0",
"[email protected]@setimmediate": "^1.0.5",
"[email protected]@sha.js": "^2.4.11",
"[email protected]@snapdragon-node": "^2.1.1",
"[email protected]@snapdragon-util": "^3.0.1",
"[email protected]@snapdragon": "^0.8.2",
"[email protected]@source-list-map": "^2.0.0",
"[email protected]@source-map-resolve": "^0.5.2",
"[email protected]@source-map-url": "^0.4.0",
"[email protected]@source-map": "^0.5.7",
"[email protected]@source-map": "^0.6.1",
"[email protected]@split-string": "^3.1.0",
"[email protected]@ssri": "^5.3.0",
"[email protected]@static-extend": "^0.1.2",
"[email protected]@stream-browserify": "^2.0.1",
"[email protected]@stream-each": "^1.2.3",
"[email protected]@stream-http": "^2.8.3",
"[email protected]@stream-shift": "^1.0.0",
"[email protected]@string_decoder": "^1.1.1",
"[email protected]@tapable": "^1.0.0",
"[email protected]@through2": "^2.0.3",
"[email protected]@timers-browserify": "^2.0.10",
"[email protected]@to-arraybuffer": "^1.0.1",
"[email protected]@to-object-path": "^0.3.0",
"[email protected]@to-regex-range": "^2.1.1",
"[email protected]@to-regex": "^3.0.2",
"[email protected]@tslib": "^1.9.3",
"[email protected]@tty-browserify": "^0.0.0",
"[email protected]@typedarray": "^0.0.6",
"[email protected]@uglify-es": "^3.3.9",
"[email protected]@uglifyjs-webpack-plugin": "^1.2.7",
"[email protected]@union-value": "^1.0.0",
"[email protected]@unique-filename": "^1.1.0",
"[email protected]@unique-slug": "^2.0.0",
"[email protected]@unset-value": "^1.0.0",
"[email protected]@upath": "^1.1.0",
"[email protected]@uri-js": "^4.2.2",
"[email protected]@urix": "^0.1.0",
"[email protected]@url": "^0.11.0",
"[email protected]@use": "^3.1.1",
"[email protected]@util-deprecate": "^1.0.2",
"[email protected]@util": "^0.10.3",
"[email protected]@util": "^0.10.4",
"[email protected]@vm-browserify": "^0.0.4",
"[email protected]@watchpack": "^1.6.0",
"[email protected]@webpack-sources": "^1.1.0",
"[email protected]@webpack": "^4.16.5",
"[email protected]@worker-farm": "^1.6.0",
"[email protected]@wrappy": "^1.0.2",
"[email protected]@xtend": "^4.0.1",
"[email protected]@y18n": "^4.0.0",
"[email protected]@yallist": "^2.1.2",
"acorn": "^5.7.1",
"acorn-dynamic-import": "^3.0.0",
"ajv": "^6.5.2",
"ajv-keywords": "^3.2.0",
"anymatch": "^2.0.0",
"aproba": "^1.2.0",
"arr-diff": "^4.0.0",
"arr-flatten": "^1.1.0",
"arr-union": "^3.1.0",
"array-unique": "^0.3.2",
"assert": "^1.4.1",
"asn1.js": "^4.10.1",
"assign-symbols": "^1.0.0",
"async-each": "^1.0.1",
"atob": "^2.1.1",
"balanced-match": "^1.0.0",
"base": "^0.11.2",
"base64-js": "^1.3.0",
"big.js": "^3.2.0",
"bluebird": "^3.5.1",
"binary-extensions": "^1.11.0",
"bn.js": "^4.11.8",
"brace-expansion": "^1.1.11",
"braces": "^2.3.2",
"brorand": "^1.1.0",
"browserify-aes": "^1.2.0",
"browserify-cipher": "^1.0.1",
"browserify-des": "^1.0.2",
"browserify-rsa": "^4.0.1",
"browserify-sign": "^4.0.4",
"browserify-zlib": "^0.2.0",
"buffer": "^4.9.1",
"buffer-from": "^1.1.1",
"buffer-xor": "^1.0.3",
"builtin-status-codes": "^3.0.0",
"cacache": "^10.0.4",
"cache-base": "^1.0.1",
"chokidar": "^2.0.4",
"chownr": "^1.0.1",
"chrome-trace-event": "^1.0.0",
"cipher-base": "^1.0.4",
"class-utils": "^0.3.6",
"collection-visit": "^1.0.0",
"commander": "^2.13.0",
"commondir": "^1.0.1",
"component-emitter": "^1.2.1",
"concat-map": "^0.0.1",
"concat-stream": "^1.6.2",
"console-browserify": "^1.1.0",
"constants-browserify": "^1.0.0",
"copy-descriptor": "^0.1.1",
"copy-concurrently": "^1.0.5",
"core-util-is": "^1.0.2",
"create-ecdh": "^4.0.3",
"create-hash": "^1.2.0",
"crypto-browserify": "^3.12.0",
"cyclist": "^0.2.2",
"date-now": "^0.1.4",
"decode-uri-component": "^0.2.0",
"define-property": "^2.0.2",
"debug": "^3.1.0",
"des.js": "^1.0.0",
"create-hmac": "^1.1.7",
"domain-browser": "^1.2.0",
"duplexify": "^3.6.0",
"elliptic": "^6.4.1",
"emojis-list": "^2.1.0",
"end-of-stream": "^1.4.1",
"errno": "^0.1.7",
"enhanced-resolve": "^4.1.0",
"eslint-scope": "^4.0.0",
"esrecurse": "^4.2.1",
"estraverse": "^4.2.0",
"events": "^1.1.1",
"evp_bytestokey": "^1.0.3",
"expand-brackets": "^2.1.4",
"extend-shallow": "^3.0.2",
"extglob": "^2.0.4",
"diffie-hellman": "^5.0.3",
"fast-deep-equal": "^2.0.1",
"fast-json-stable-stringify": "^2.0.0",
"fill-range": "^4.0.0",
"find-cache-dir": "^1.0.0",
"flush-write-stream": "^1.0.3",
"find-up": "^2.1.0",
"fragment-cache": "^0.2.1",
"for-in": "^1.0.2",
"from2": "^2.3.0",
"fs-write-stream-atomic": "^1.0.10",
"fs.realpath": "^1.0.0",
"fsevents": "^1.2.4",
"get-value": "^2.0.6",
"glob": "^7.1.2",
"glob-parent": "^3.1.0",
"graceful-fs": "^4.1.11",
"has-value": "^1.0.0",
"has-values": "^1.0.0",
"hash-base": "^3.0.4",
"hash.js": "^1.1.5",
"https-browserify": "^1.0.0",
"hmac-drbg": "^1.0.1",
"ieee754": "^1.1.12",
"iferr": "^0.1.5",
"imurmurhash": "^0.1.4",
"indexof": "^0.0.1",
"inherits": "^2.0.3",
"inflight": "^1.0.6",
"is-accessor-descriptor": "^1.0.0",
"is-binary-path": "^1.0.1",
"is-buffer": "^1.1.6",
"is-data-descriptor": "^1.0.0",
"is-extendable": "^1.0.1",
"is-descriptor": "^1.0.2",
"is-extglob": "^2.1.1",
"is-glob": "^4.0.0",
"is-plain-object": "^2.0.4",
"is-number": "^3.0.0",
"isarray": "^1.0.0",
"is-windows": "^1.0.2",
"isobject": "^3.0.1",
"json-parse-better-errors": "^1.0.2",
"json5": "^0.5.1",
"json-schema-traverse": "^0.4.1",
"kind-of": "^6.0.2",
"loader-runner": "^2.3.0",
"loader-utils": "^1.1.0",
"locate-path": "^2.0.0",
"lodash.debounce": "^4.0.8",
"long": "^4.0.0",
"lru-cache": "^4.1.3",
"make-dir": "^1.3.0",
"mamacro": "^0.0.3",
"map-cache": "^0.2.2",
"map-visit": "^1.0.0",
"md5.js": "^1.3.4",
"memory-fs": "^0.4.1",
"micromatch": "^3.1.10",
"miller-rabin": "^4.0.1",
"minimalistic-assert": "^1.0.1",
"minimatch": "^3.0.4",
"minimalistic-crypto-utils": "^1.0.1",
"mississippi": "^2.0.0",
"minimist": "^0.0.8",
"mixin-deep": "^1.3.1",
"mkdirp": "^0.5.1",
"move-concurrently": "^1.0.1",
"ms": "^2.0.0",
"nanomatch": "^1.2.13",
"neo-async": "^2.5.1",
"node-libs-browser": "^2.1.0",
"normalize-path": "^2.1.1",
"object-visit": "^1.0.1",
"object-copy": "^0.1.0",
"once": "^1.4.0",
"object.pick": "^1.3.0",
"p-limit": "^1.3.0",
"os-browserify": "^0.3.0",
"p-locate": "^2.0.0",
"p-try": "^1.0.0",
"pako": "^1.0.6",
"parse-asn1": "^5.1.1",
"parallel-transform": "^1.1.0",
"pascalcase": "^0.1.1",
"path-browserify": "^0.0.0",
"path-dirname": "^1.0.2",
"path-exists": "^3.0.0",
"path-is-absolute": "^1.0.1",
"pbkdf2": "^3.0.16",
"pkg-dir": "^2.0.0",
"pify": "^3.0.0",
"posix-character-classes": "^0.1.1",
"promise-inflight": "^1.0.1",
"prr": "^1.0.1",
"process": "^0.11.10",
"pseudomap": "^1.0.2",
"process-nextick-args": "^2.0.0",
"pump": "^2.0.1",
"public-encrypt": "^4.0.2",
"pumpify": "^1.5.1",
"punycode": "^2.1.1",
"querystring": "^0.2.0",
"querystring-es3": "^0.2.1",
"randombytes": "^2.0.6",
"randomfill": "^1.0.4",
"readable-stream": "^2.3.6",
"readdirp": "^2.1.0",
"regex-not": "^1.0.2",
"remove-trailing-separator": "^1.1.0",
"repeat-element": "^1.1.2",
"repeat-string": "^1.6.1",
"resolve-url": "^0.2.1",
"ret": "^0.1.15",
"rimraf": "^2.6.2",
"ripemd160": "^2.0.2",
"run-queue": "^1.0.3",
"safe-buffer": "^5.1.2",
"safe-regex": "^1.1.0",
"schema-utils": "^0.4.7",
"serialize-javascript": "^1.5.0",
"set-immediate-shim": "^1.0.1",
"set-value": "^2.0.0",
"setimmediate": "^1.0.5",
"sha.js": "^2.4.11",
"snapdragon": "^0.8.2",
"snapdragon-util": "^3.0.1",
"snapdragon-node": "^2.1.1",
"source-list-map": "^2.0.0",
"source-map": "^0.6.1",
"source-map-resolve": "^0.5.2",
"source-map-url": "^0.4.0",
"split-string": "^3.1.0",
"ssri": "^5.3.0",
"static-extend": "^0.1.2",
"stream-browserify": "^2.0.1",
"stream-each": "^1.2.3",
"stream-http": "^2.8.3",
"stream-shift": "^1.0.0",
"string_decoder": "^1.1.1",
"tapable": "^1.0.0",
"through2": "^2.0.3",
"timers-browserify": "^2.0.10",
"to-arraybuffer": "^1.0.1",
"to-regex": "^3.0.2",
"to-regex-range": "^2.1.1",
"tslib": "^1.9.3",
"to-object-path": "^0.3.0",
"tty-browserify": "^0.0.0",
"uglify-es": "^3.3.9",
"uglifyjs-webpack-plugin": "^1.2.7",
"typedarray": "^0.0.6",
"[email protected]@randombytes": "^2.0.6",
"union-value": "^1.0.0",
"unique-filename": "^1.1.0",
"unique-slug": "^2.0.0",
"unset-value": "^1.0.0",
"upath": "^1.1.0",
"uri-js": "^4.2.2",
"urix": "^0.1.0",
"url": "^0.11.0",
"use": "^3.1.1",
"util": "^0.10.4",
"util-deprecate": "^1.0.2",
"vm-browserify": "^0.0.4",
"watchpack": "^1.6.0",
"webpack-sources": "^1.1.0",
"worker-farm": "^1.6.0",
"wrappy": "^1.0.2",
"xtend": "^4.0.1",
"yallist": "^2.1.2",
"y18n": "^4.0.0"
},
"scripts": {
"dev": "NODE_ENV=development webpack",
"prod": "NODE_ENV=production webpack",
"watch": "npm run build -- --watch"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": ""
}
index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
我的一個webpack
<div class="demo1"></div>
<div class="demo2"></div>
<!-- <script src="./dist/bundle.js"></script> -->
<!-- 代替上面的bundle.js,1以注入的方式 -->
<%=htmlWebpackPlugin.files.webpackManifest%>
</body>
</html>
相關推薦
react+webpack 打包，開發環境和生產環境整合一體拿來就能用
直接上程式碼： webpack.config.js import webpack from "webpack"; import path from "path"; var path = path.resolve(__dirname,"/main.j") var
Android ListView和Fragment結合使用，類似於某電商的實現，拿來就能用,詳細標註適合新手
一個類似於某電商的實現，讓菜鳥們理解Activity與Fragment之間的引數是如何互動的。 包結構： 執行後的效果 分析： 左側ListView可上下拖動，點選不同的item會影響右側Fragment的內容。 廢話不多說，上程式碼（
只需要三步就可以建立錯誤日誌，記錄錯誤日誌，拿來就能用，無需改
第一步，在網站上建立一個資料夾，取名error（針對下面的程式碼只能用這個） 第二步，在網站上右鍵》新增新建項》全域性應用程式類 ，就是Global.asax（不能改名字，只能建立一次）， global檔案的 內容：（把這些全考過去就行了，其實改變的只是Applicati
手把手教你用webpack3搭建react項目(開發環境和生產環境)(一)
stc reac config nod top llb cor git history 開發環境和生產環境整個配置源碼在github上，源碼地址：github-webpack-react 如果覺得有幫助，點個Star謝謝！！ (一)是開發環境，(二)是生產環境。 一、首
Spring Cloud 進階之路 -- Eureka的高可用，搭建 Eureka叢集（開發環境和生產環境）
Eureka 作為註冊中心，必須保障高可用，否則會直接影響有關的整個服務體系。 以下分別進行開發環境和生產環境的多服務中心叢集配置。 目錄 一、開發環境簡易配置： 1、配置Configurations 2、在Configurations 裡
springboot不同環境，不同配置的實現（開發環境和生產環境的切換）
首先，是我實現的最終效果圖可以看到這裡配置了3個application，其中第一個是總的配置，第二個是開發環境，第三個是生產環境。總的配置總是會生效的，而另外兩個配置生效的條件，則要看看我們在總的配置裡配置了什麼，比如這裡，我在application.yml裡配置了開發環境s
webpack開發環境和生產環境切換原理
在package.json中有如下設定： "scripts": { "dev": "node build/dev-server.js", "build:prod": "cross-env NODE_E
webpack -- 關於proxyTable的配置在開發環境和生產環境中的原理解析
前言 首先，proxyTable是我們在本地開發環境中除錯介面用的，目的是為了解決本地跨域的問題，因為本地地址為localhost:xxxx/xxx 在線上的生產環境是沒用的！！！ 假設我們用的是vue-cli命令列工具生成的webpack專案模板
Spring Cloud 進階之路 -- Eureka的高可用，搭建 Eureka叢集（開發環境和生產環境）
Eureka 作為註冊中心，必須保障高可用，否則會直接影響有關的整個服務體系。 以下分別進行開發環境和生產環境的多服務中心叢集配置。 目錄 一、開發環境簡易配置： 1、配置Configurations 在上一
Webpack配置區分開發環境和生產環境
在專案開發的時候，我們通常會將程式分為開發環境和生產環境（或者叫線上環境），開發環境通常指的是我們正在開發的這個階段所需要的一些環境配置，也就是方便我們開發人員除錯開發的一種環境；生產環境通常指的是我們將程式開發完成經過測試之後無明顯異常準備釋出上線的環境，也可以理解為使用者可以正常使用的就是生產環境；
vuejs經驗交流之-開發環境和生產環境的啟動
分享 技術 cli cnpm 刪掉 經驗交流 http 開發環境 yarn vue開發環境 首先要下載必要的包 命令 cnpm install/yarn install 1 啟動後臺服務 npm run server
開發環境 測試環境 和生產環境的區別
對於一個剛進入公司的新人來說，在熟悉工作環境的時候，會聽著幾個“老人”在自己可視範圍之外或者輕鬆的討論著業務，其措辭拿捏精準，期間，涉及到一系列的概念，可能會讓你不覺明厲，暗歎：“高階，大氣，上檔次”。有些術語，它既有官方稱呼，也有通俗叫法，對於不覺明厲的我們只
Docker 標準化開發測試和生產環境
對於大部分企業來說，搭建 PaaS 既沒有那個精力，也沒那個必要，用 Docker 做個人的 sandbox 用處又小了點。可以用 Docker 來標準化開發、測試、生產環境。Docker 佔用資源小，在一臺 E5 128 G 記憶體的伺服器上部署 100 個容器都綽綽有餘，
騰訊雲的開發環境和生產環境傻傻分不清
開發環境和生產環境 為了方便開發除錯，防止影響到線上服務，騰訊雲提供開發和生產兩套環境，兩套環境擁有以下特點： 開發環境 免費使用 自動分配測試用二級域名：xxxxxxx.qcloud.la 自動部署免費 HTTPS 僅可用於線上除錯，不可釋出
解決測試環境和生產環境頁面路徑不匹配的辦法
實際應用中，一般用來解決jsp測試和生產環境路徑不同的問題： <% String appContext = request.getContextPath(); String basePath = request.getScheme()+"://"+request.get
Android 測試環境和生產環境動態切換實現思路
在開發專案的過程中，通常會遇到開發環境、測試環境、預釋出環境、生產環境等多種環境互相切換的問題。客戶端需要根據不同環境選擇不同的域名呼叫介面，或者展示一些隱藏功能。如果每切換一種環境都需要重新打包，那就變得太蛋疼了。簡單的說下思路，就是把需要更改的域名以檔案形式存到SD卡里，通過修改/讀取檔案
navicat測試環境和生產環境資料結構同步
測試環境完成測試，資料庫的修改的資料結構需要同步到生產環境的資料庫。可以通過寫指令碼的方式完成資料同步，當然navicat提供了更簡單的方式 第一步：工具-結構同步 第二步：對比正式庫和測試庫存
Maven 如何為不同的環境打包 —— 開發、測試和生產環境
在開發過程中，我們的軟體會面對不同的執行環境，比如開發環境、測試環境、生產環境，而我們的軟體在不同的環境中，有的配置可能會不一樣，比如資料來源配置、日誌檔案配置、以及一些軟體執行過程中的基本配置，那每次我們將軟體部署到不同的環境時，都需要修改相應的配置檔案，這樣來回修改
vue+axios 開發環境與生產環境配置請求介面，本地開發和線上開發有多個請求地址怎麼處理？上線後自動獲取ip,不需改請求地址可運用多個專案中
1. 配置本地開發環境介面： 進入到專案目錄config檔案中index.js ；當頁面有多個不同地址時此可以重定向，下圖中會出現報錯的就是路徑問題， 建立所有httpUrl介面請求。舉例後臺請求地址為：192.168.11.12:80/omc/login ,第一個
【Spring】使用@Profile註解實現開發、測試和生產環境的配置和切換，看完這篇我徹底會了！！
## 寫在前面 > 在實際的企業開發環境中，往往都會將環境分為：開發環境、測試環境和生產環境，而每個環境基本上都是互相隔離的，也就是說，開發環境、測試環境和生產環境是互不相通的。在以前的開發過程中，如果開發人員完成相應的功能模組並通過單元測試後，會通過手動修改配置檔案的形式，將專案的配置修改成測試環境